0

みなさん、こちらのサイトをご覧ください。

わずかなjqueryの問題があり、デバッグ方法がわからないようです。

サムネイルのストリップは、その上にカーソルを合わせるとスクロールすることになっています。ページが読み込まれるとき、またはハードリフレッシュで読み込まれるとき、スクロールしません。

ページを更新すると(通常、ハード更新ではありません)、正常に機能します。

何か案は?

- - - - - - - - アップデート - - - - - - - - - -

これは、他のコードが邪魔にならないクリーンなバージョンです。

ここにリンク

これが私が巻物を作るのに使っているJSコードです

スクロールさせるコードについては、後半を参照してください。

   $(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);
 });
});
4

3 に答える 3

1

私は非常によく似た問題を抱えていました。

また、document.ready()をwindow.load()に変更しようとしましたが、問題は解決しませんでした。

たくさんの研究開発の結果、画像サイズがこの問題の原因であることがわかりました。私の要件は400*400 pxの画像でしたが、巨大な画像を使用していました。たとえば、一部の画像は1080pを超えていました。

画像のサイズを変更し、それらの画像を再アップロードすると、うまくいきました。

于 2016-05-13T07:01:38.227 に答える
0

height()画像が読み込まれる前に、または同様の位置付け方法を使用しているためだと思います。

しかし、ソースコードを見ないと、はっきりとはわかりません。

于 2009-10-28T16:46:58.580 に答える
0

たぶん、あなたがコードを投稿することができれば、あなたが参照している正確なインクルードについてページを閲覧するよりも簡単でしょう...

とにかく、DOMが完全にロードされるようにするためにinitメソッドをどのように含めるべきかを囲んでいないに違いありません。

$(function (){
  // Put everything you want to run on page load here, to ensure it's
  // only run when the DOM has loaded entirely.
});
于 2009-10-28T16:47:03.357 に答える