JQuery Laden Problem beim ersten Laden / Fest refresh

Question

Hey everyone, hier ist die Website SIEHE UNTEN

Ich habe ein leichtes jquery Problem und ich kann nicht scheinen, um herauszufinden, wie es zu debuggen.

das Band von Thumbnails soll scrollen, wenn Sie den Mauszeiger über sie. Wenn die Seite geladen wird, oder auf einer harten refresh lädt, nicht sie blättern.

Wenn ich die Seite aktualisieren (normalerweise keine harte refresh), es funktioniert gut.

Irgendwelche Ideen?

---------------- UPDATE -------------------

Hier ist eine saubere Version mit keinem anderen Code in der Art und Weise:

Link-hier

Und hier ist der JS-Code Ich bin mit dem Buch zu produzieren

Sehen Sie die zweite Hälfte für den Code, der es blättern macht.

   $(document).ready(function() {
    $('#slideshow').cycle({
  fx:     'fade', 
    next:   '#next', 
 pause: 1,
    prev:   '#prev',
 pause: '#pause',
 pager:  '.thumbs',
 pagerClick:function(zeroBasedSlideIndex, slideElement) {$(slideElement).find('div.cover').hide();},
 pagerAnchorBuilder: function(idx, slide) {
                        var src = $('img',slide).attr('src');
      //Change height of thumbnail here
                         return '<li><a href="#"><img src="' + slide.src + '" width="75" /></a></li>'; 
     //  return '<li><a href="#"><img src="' + src + '"  height="90" /></a></li>'; 
                } 
 });
$(function() {
    //Pause slideshow on page load
    $("#slideshow").cycle('pause');

});


 //Get our elements for faster access and set overlay width
 var div = $('div.sc_menu'),
  ul = $('ul.sc_menu'),
  ulPadding = 15;
 //Get menu width
 var divWidth = div.width();
 //Remove scrollbars 
 div.css({overflow: 'hidden'});
 //Find last image container
 var lastLi = ul.find('li:last-child');
 //When user move mouse over menu
 div.mousemove(function(e){
  //As images are loaded ul width increases,
  //so we recalculate it each time
  var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding; 
  var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth;
  div.scrollLeft(left);
 });
});

Answer 1

Vielleicht, wenn Sie nach dem Code könnte es einfacher als gerade die Seite würde für die genaue schließen Sie sich beziehen ...

Wie auch immer, I Wette Sie Ihre init Methoden nicht einschließt, wie sie sollten, um sicherzustellen, werden der DOM vollständig geladen:

$(function (){
  // Put everything you want to run on page load here, to ensure it's
  // only run when the DOM has loaded entirely.
});

Answer 2

Ich habe ein sehr ähnliches Problem habe.

Ich habe auch versucht zu ändern document.ready () () window.load aber nicht mein Problem zu lösen.

Nach vielen vielen R & D fand ich Größen das Bild aus, dieses Problem verursacht wurden. meine Anforderung war 400 * 400 px Bilder, aber ich war mit großen Bildern z.B. einige Bilder waren über 1080p.

Wenn ich die Größe neu bestimmt meine Bilder und neu hochgeladen thoses Bilder ... es hat funktioniert.

Answer 3

Ich denke, es ist, weil Sie height() oder ähnliche Position Methoden vor den Bildern Last verwenden.

Allerdings ohne den Quellcode zu sehen, die ich sicher nicht sagen.