JavaScript에서 회전식 효과/슬라이더 효과를 만들려면 어떻게해야합니까?

Question

나는 이런 식으로 뭔가를 할 :

나 자신에 의해 그것을 구현하려고 노력하지만 결과는 추한했다. 나는 jCarousel을 보았지만 나는 그것을 좋아하지 않았다. Javascript 및/또는 jQuery에서 이상적인 효과를 낼 수있는 다른 기술이나 라이브러리가 있습니까?

Answer 1

JQuery와 흐름 플러그인을 사용하여이 튜토리얼 따르

http://net.tutsplus.com/articles/news/using-the-wonderful-jflow-plugin-screencast/

<script type="javascript" src="js/jFlow.js"></script> 

<div id="wrap"> 
<div id="controller"> 
    <span class="jFlowControl">No 1 </span> 
    <span class="jFlowControl">No 2 </span> 
    <span class="jFlowControl">No 3 </span> 
</div> 

<div id="prevNext"> 
    <img src="images/prev.png" alt="Previous" class="jFlowPrev"> 
    <img src="images/next.png" alt="Next" class="jFlowNext"> 
</div> 

<div id="slides"> 
<div><img src="images/1.jpg"> 
    Here is a featured image. Nice! 
</div> 
<div><img src="images/2.jpg"> 

Here is another neat featured image. Nice! 
</div> 
<div><img src="images/3.jpg"> 

Here is one last very cool featured image. Nice! 
</div></div> 
</div> 

$(function() { 
    $("#controller").jFlow({ 
    slides: "#slides", 
    width: "980px", 
    height: "313px", 
    duration: 600 
}); 

을}); 이것

Answer 2

봐 :

http://www.instantshift.com/2012/03/26/80-useful-jquery-plugins-to-enrich-your-sites-user-experience/

80 JQuery와 플러그인 사이트를 향상. JCarousel은 그러한 슬라이더를 만드는 데 사용할 수 있지만 위의 목록에서 nr 3을 선호합니다 : Flexslider. 여러 플랫폼 (태블릿/휴대 전화/유연한 HTML 레이아웃)의 크기를 조정할 수있는 반응 형 슬라이더로 사용할 수 있습니다.