http://www.gougouzian.fr/projects/jquery/moodular/



moodular_carousel.html




<ul id="demo">
   
<li>
       
<img src="img/photo01.jpg" />
       
   
</li>
   
<li>
       
<img src="img/photo02.jpg" />
       
   
</li>
   
<li>
       
<img src="img/photo03.jpg" />
       
   
</li>
   
<li>
       
<img src="img/photo04.jpg" />
       
   
</li>
   
<li>
       
<img src="img/photo05.jpg" />
       
   
</li>
   
<li>
       
<img src="img/photo06.jpg" />
       
   
</li>
</ul>

The CSS is :

#demo, #demo li { margin:0; padding:0; width:900px; height:495px; list-style:none; }
#demo { overflow: hidden; }
       
#demo li { float:left; }

The JavaScript is :

jQuery('#demo').moodular({
        effects
: 'left',
        controls
: '',
       
auto: true,
        easing
: '',
        speed
: 1000,
        dispTimeout
: 3000      
});

'JavaScript > jQuery' 카테고리의 다른 글

Mouse Wheel  (0) 2012.11.27
has(), is()  (0) 2012.07.22
jQuery 플러그인과 그 메서드들을 만들기 위한 기본구조..  (0) 2012.01.01
jQuery 플러그인들 수집  (0) 2011.12.28
jQuery Template  (0) 2011.12.27
jQuery() 함수 인자들 정리  (0) 2011.11.07
Posted by altvirus
,