Nivo Slider wird auf Webspace nicht angezeigt
asfsdfdsf33w
- css
- html
- javascript
Hallo, ich habe den NivoSlider verwendet. Lokal funktioniert er auch einwandfrei. Jetzt habe ich die Dateien mal auf den Webspace hochgeladen und schon wird der nciht angezeigt.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Titel</title>
<link rel="stylesheet" href="style.css">
<script type="text/javascript" href="jquery.js"></script>
<link rel="stylesheet" href="themes/default/default.css" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script>
<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
</script>
</head>
<body><div id="all">
<div name="home" id="home">
<div id="wechselndesbild">
<div class="slider-wrapper theme-default">
<div class="ribbon"></div>
<div id="slider" class="nivoSlider">
<img src="images/slide1.jpg"/>
<img src="images/slide2.jpg"/>
<img src="images/slide3.jpg"/>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
#all {
margin: -9px auto;
padding: 0;
width: 1094px;
background: white;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: #3e3c3c;
}
#home{
background-color: white;
height: 900px;
width: 1094px;
padding-top: 48px;
}
#wechselndesbild{
width: 1000px;
height: 300px;
margin-top: 10px;
margin-left: 47px;
z-index: 1;
}
.nivoSlider {
position:relative;
width:100%;
height:auto;
overflow: hidden;
}
.nivoSlider img {
position:absolute;
top:0px;
left:0px;
max-width: none;
}
.nivo-main-image {
display: block !important;
position: relative !important;
width: 100% !important;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:0;
padding:0;
margin:0;
z-index:6;
display:none;
background:white;
filter:alpha(opacity=0);
opacity:0;
}
/* The slices and boxes in the Slider */
.nivo-slice {
display:block;
position:absolute;
z-index:5;
height:100%;
top:0;
}
.nivo-box {
display:block;
position:absolute;
z-index:5;
overflow:hidden;
}
.nivo-box img { display:block; }
/* Caption styles */
.nivo-caption {
position:absolute;
left:0px;
bottom:0px;
background:#000;
color:#fff;
width:100%;
z-index:8;
padding: 5px 10px;
opacity: 0.8;
overflow: hidden;
display: none;
-moz-opacity: 0.8;
filter:alpha(opacity=8);
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box; /* Firefox, other Gecko */
box-sizing: border-box; /* Opera/IE 8+ */
}
.nivo-caption p {
padding:5px;
margin:0;
}
.nivo-caption a {
display:inline !important;
}
.nivo-html-caption {
display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
position:absolute;
top:45%;
z-index:9;
cursor:pointer;
}
.nivo-prevNav {
left:0px;
}
.nivo-nextNav {
right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav {
text-align:center;
padding: 15px 0;
}
.nivo-controlNav a {
cursor:pointer;
}
.nivo-controlNav a.active {
font-weight:bold;
}
Hallo, ich habe den NivoSlider verwendet. Lokal funktioniert er auch einwandfrei. Jetzt habe ich die Dateien mal auf den Webspace hochgeladen und schon wird der nciht angezeigt.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script>
<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
Das erste Skript wird im Netz gesucht, das zweite in deinem root und das dritte?
Gruß Jo
Hallo Jo,
Das erste Skript wird im Netz gesucht, das zweite in deinem root und das dritte?
das ist eine Schreibweise, der es egal ist, ob es http oder https ist. Die richtet sich je nach dem, wie du die Seite aufgerufen hast. Leider kenne ich die Bezeichnung dafür nicht. Sie ist m. E. nach zu bevorzugen, da es sonst dazu führen kann, dass du auf Webseiten Probleme mit https bekommst, weil nicht alle Ressourcen darüber geladen wurden.
Freundliche Grüße
Christian
Hallo Jonathan Harker,
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script> <script src="jquery.nivo.slider.pack.js" type="text/javascript"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
Das erste Skript wird im Netz gesucht, das zweite in deinem root und das dritte?
Auch im Netz. Es handelt sich um eine protokoll-relative URL.
Bis demnächst
Matthias
Hallo asfsdfdsf33w,
kannst du deine Seite mal mit den Entwickler-Tools eventuell mal nachschauen ob es zu Fehlern kommen? Speziell in der Konsole und eventuell in der Netzwerkanalyse, welcher Status-Code bei den zu ladenden Bildern steht.
Freundliche Grüße
Christian
Hallo asfsdfdsf33w,
kannst du deine Seite mal mit den Entwickler-Tools eventuell mal nachschauen ob es zu Fehlern kommen? Speziell in der Konsole und eventuell in der Netzwerkanalyse, welcher Status-Code bei den zu ladenden Bildern steht.
Freundliche Grüße
Christian
In der Konsole steht: Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# insteadjquery.min.js:1 getPreventDefault() sollte nicht mehr verwendet werden. Verwenden Sie stattdessen defaultPrevented.jquery.min.js:5:17101
Bei der Netzwerkanalyse: Angefragte Adresse: http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js Anfragemethode: GET Status-Code: 304 Not Modified Version: HTTP/1.1
Bei der lokalen Version wo es funktioniert Werden auch die Daten direkt vom Server benötigt?
Und was ist mit den Bildern? Irgendwo müssen deine Bilder auftauchen.
Freundliche Grüße
Christian
Und was ist mit den Bildern? Irgendwo müssen deine Bilder auftauchen.
Freundliche Grüße
Christian
Da ist eine lange Liste. Immer ein Bild mehrfach, dann wieder ein anderes.
file:///C:/Users/Name/Desktop/Ordner/images/slide3.jpg file:///C:/Users/Name/Desktop/Ordner/images/slide3.jpg file:///C:/Users/Name/Desktop/Ordner/images/slide3.jpg ... file:///C:/Users/Name/Desktop/Ordner/images/slide2.jpg
und so weiter
Da siehst du dein Problem: Du hast die falschen Pfade angegeben. Das sind lokale Pfade auf deinem PC, nicht auf dem Webspace. Passe die Pfade an, und es sollte funktionieren.
Da siehst du dein Problem: Du hast die falschen Pfade angegeben. Das sind lokale Pfade auf deinem PC, nicht auf dem Webspace. Passe die Pfade an, und es sollte funktionieren.
Ne das ist nicht das Problem die Pfade sind richtig. Das ist ja lokal gestartet. Da ist die index.html auch in C:/Users/Name/Desktop/Ordner/index.html Das sollte also nicht das Problem sein. Das Bild wird ja auch wie folgt aufgerufen: <img src="images/slide2.jpg"/>
Dein Slider funktioniert im Webspace nicht, dann solltest du das auch da testen, sonst hat das ja keinen Sinn. Teste es bitte dort einmal.
Dein Slider funktioniert im Webspace nicht, dann solltest du das auch da testen, sonst hat das ja keinen Sinn. Teste es bitte dort einmal.
TypeError: $(...).nivoSlider is not a function <anonym> x.event.dispatch() jquery.min.js:5 x.event.add/v.handle() jquery.min.js:5
Dann wird die nivo-Datei möglicherweise nicht geladen. Überprüfe das mal in der Netzwerkanalyse. Und schau mal nach, ob die jquery.nivo.slider.pack.js sich im gleichen Verzeichnis befindet, wie deine html-Datei.
Freundliche Grüße
Christian
Dann wird die nivo-Datei möglicherweise nicht geladen. Überprüfe das mal in der Netzwerkanalyse. Und schau mal nach, ob die jquery.nivo.slider.pack.js sich im gleichen Verzeichnis befindet, wie deine html-Datei.
Freundliche Grüße
Christian
Die befindet sich im gleichen Ordner. Die jquery.nivo.slider.pack.js wird wohl geladen. Der status ist 304 not modified
OK, eventuell liegt es an der Ladereihenfolge. Versuch mal
$(window).load(function() {
$('#slider').nivoSlider();
});
gegen
$(function() {
$('#slider').nivoSlider();
});
auszutauschen.
OK, eventuell liegt es an der Ladereihenfolge. Versuch mal
$(window).load(function() { $('#slider').nivoSlider(); });
gegen
$(function() { $('#slider').nivoSlider(); });
auszutauschen.
ändert leider nichts
Gib bitte einfach mal den Link, dann kann ich da selber schauen. Bin mir gerade nicht so ganz sicher, was das Problem ist.
Gib bitte einfach mal den Link, dann kann ich da selber schauen. Bin mir gerade nicht so ganz sicher, was das Problem ist.
Könnte es sein, dass das einfach nicht unterstützt wird? Ist schon ein ziemlich alter Webspace. Andererseits funktioniert SmoothScroll auch
JavaScript läuft im Browser, insofern hat das mit dem Webspace nicht so viel zu tun. Ggf. macht der Webspace irgendwo Probleme, aber das kann ich mit den bisher erhaltenen Informationen nicht sagen.
JavaScript läuft im Browser, insofern hat das mit dem Webspace nicht so viel zu tun. Ggf. macht der Webspace irgendwo Probleme, aber das kann ich mit den bisher erhaltenen Informationen nicht sagen.
Okay. Aber es muss ja quasi daran liegen. Macht ja keinen Sinn, dass es lokal ohne Probleme läuft
Hallo,
JavaScript läuft im Browser, insofern hat das mit dem Webspace nicht so viel zu tun. Ggf. macht der Webspace irgendwo Probleme, aber das kann ich mit den bisher erhaltenen Informationen nicht sagen.
Okay. Aber es muss ja quasi daran liegen. Macht ja keinen Sinn, dass es lokal ohne Probleme läuft
es gibt viele Gründe, warum etwas nur lokal läuft. Poste den Link zu deiner Testseite, dann wird man weitersehen können.
Gruß
Jürgen
Hallo,
<script type="text/javascript" href="jquery.js"></script>
…
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script>
…
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
außerdem bindest du drei (!) verschiedene (?) Versionen von jquery ein. Das führt im besten Fall zu einem „funktioniert trotzdem“.
Gruß
Jürgen
Grundlage für Zitat #2156.
Hallo,
<script type="text/javascript" href="jquery.js"></script> … <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script> … <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
außerdem bindest du drei (!) verschiedene (?) Versionen von jquery ein. Das führt im besten Fall zu einem „funktioniert trotzdem“.
Gruß
Jürgen
Oh man, das war der Fehler. Dankeschön! Und sorry für den unnötigen Fehler :D
Guten Abend Jürgen,
das habe ich gar nicht wahrgenommen. ;-) Gut, dass du noch mal drüber geschaut hast. :-)
Freundliche Grüße
Christian
Hallo,
das habe ich gar nicht wahrgenommen. ;-) Gut, dass du noch mal drüber geschaut hast. :-)
ich hatte den Fehler auch woanders vermutet, die jquery-Sache war nur ein „by the way“.
Gruß
Jürgen