문제

안녕하세요 여러분, 여기 사이트가 있습니다

약간의 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);
 });
});
도움이 되었습니까?

해결책

코드를 게시 할 수 있다면 정확한 포함에 대한 페이지를 탐색하는 것보다 더 쉽습니다.

어쨌든, 나는 내기 당신은 당신의 초기 방법을 둘러싸고 있지 않습니다.

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

다른 팁

나는 매우 비슷한 문제가있었습니다.

또한 windren.load ()를 Window.load ()로 변경하려고 시도했지만 내 문제를 해결하지 못했습니다.

많은 R & D 후에 나는 이미지 크기 가이 문제를 일으킨다는 것을 알았습니다. 내 요구 사항은 400 * 400 PX 이미지 였지만 거대한 이미지를 사용하고있었습니다. 예를 들어 일부 이미지는 1080p 이상이었습니다.

이미지를 재조정하고 이미지를 다시 업로드했을 때 ... 작동했습니다.

나는 당신이 사용하기 때문이라고 생각합니다 height() 또는 이미지로드 전에 유사한 위치 방법.

그러나 소스 코드를 보지 않고는 확실히 말할 수 없습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top