어떻게이 jQuery 슬라이더를 자동으로 만들 수 있습니까?

나는 완전히 정직 할 것이며 어딘가에서 다운로드 할 때이 슬라이더가 있다는 것을 알려줄 것입니다. Javascript에 대한 지식은 매우 작습니다.어떻게이 jQuery 슬라이더를 자동으로 만들 수 있습니까?

슬라이더가 4 또는 5 초마다 자동으로 다음 이미지 나 콘텐츠로 이동하려고하는데, 마우스가 콘텐츠 위에 마우스를 가져 가면 슬라이더를 멈추게하고 싶습니다. 여기

당신은 document.ready 함수 내에서 다음과 같이 뭔가를 넣을 수있는 내 코드

$(document).ready(function(){ 

    if(jQuery("#slider").length){ 
     var totalImages = jQuery("#slider > li").length, 
      imageWidth = jQuery("#slider > li:first").outerWidth(true), 
      totalWidth = imageWidth * totalImages, 
      visibleImages = Math.round(jQuery("#slider-wrap").width()/imageWidth), 
      visibleWidth = visibleImages * imageWidth, 
      stopPosition = (visibleWidth - totalWidth); 

     jQuery("#slider").width(totalWidth); 

     jQuery("#gallery-prev").click(function(){ 
      if(jQuery("#slider").position().left < 0 && !jQuery("#slider").is(":animated")){ 
       jQuery("#slider").animate({left : "+=" + imageWidth + "px"}); 
      } 
      return false; 
     }); 

     jQuery("#gallery-next").click(function(){ 
      if(jQuery("#slider").position().left > stopPosition && !jQuery("#slider").is(":animated")){ 
       jQuery("#slider").animate({left : "-=" + imageWidth + "px"}); 
      } 
      return false; 
     }); 
    } 

});

출처

2013-09-06 Luke Wolfenden

입니다 :

당신이 멀리 떨어져, 기본적으로 당신은 당신의 다음 클릭 기능을 다시 사용할 필요가 없습니다

var autoNext = setInterval(
    function() { 
     jQuery("#gallery-next").click(); 
    }, 
    4000 
); 

jQuery("#id-of-the-content-that-stops-auto-scroll").mouseover(function() { 
    clearInterval(autoNext); 
    jQuery(this).unbind('mouseover'); 
});

출처

2013-09-06 21:26:29 zigdawgydawg

안녕하세요,이 방법이 마음에 들지만 페이지를 다시로드 할 때까지 자동 스크롤을 해제하면 다시 자동 스크롤되지 않습니다. –

안녕하세요. 나는 @ ShanRobertson의 대답이 당신이 찾고있는 것에 더 가깝다고 생각합니다. 그의 대답이 당신을 위해 작동하지 않으면 알려주십시오. – zigdawgydawg

다음과 같은 타이머를 사용하면 다음과 같은 버튼을 누를 수 있습니다.

// Autoslide 
timer = window.setInterval("autoSlide()", 1000); 
function autoSlide(){ jQuery("#gallery-next").click(); }

따라서 1 초 (1000ms)마다 다음 버튼을 클릭하고 슬라이드. 슬라이더를 처음으로 다시 설정하려면 무언가를 써야합니다. 당신은 호버에 슬라이드 쇼를 일시 정지하려면 :

jQuery('#slider').hover(function(){ 
    window.clearInterval(timer); 
}, function(){ 
    timer = window.setInterval("autoSlide()", 1000); 
});

당신이 누군가가 원하는, 그래서 만약 var에 타이머를 저장하고 단지 난 그냥 내 코드의 일부를 복사하고있어, 다시 VAR를 호출 할 수 있습니다 나를 정정 해주세요!

출처

2013-09-06 21:32:44

어떻게이 jQuery 슬라이더를 자동으로 만들 수 있습니까?

답변

관련 문제