Program Study/Jquery
jquery 자동 스크롤 되는 Slide배너
papermaster
2010. 2. 10. 09:56
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="http://www.gmarwaha.com/css/style.css" type="text/css" media="screen">
<title>jCarousel Lite</title>
<script type="text/javascript" src="/js/jquery_lastest.js"></script>
<script type="text/javascript" src="/js/jcarousellite_1.0.1.pack.js"></script>
</head>
<body>
<div id="content">
<div id="contentInner" class="twoColumn">
<div id="jCarouselLiteDemo" class="cEnd">
<div class="primaryContent">
<div id="demo" class="cEnd tabs-container">
<h2>Default Configuration</h2>
<div class="carousel default">
<button class="prev"><<</button>
<div class="jCarouselLite">
<ul>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/1.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/2.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/3.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/4.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/5.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/6.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/7.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/8.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/9.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/10.jpg" alt="" width="150" height="118"></li>
<li><img src="http://www.gmarwaha.com/jquery/jcarousellite/image/11.jpg" alt="" width="150" height="118"></li>
</ul>
</div>
<button class="next">>></button>
<div class="clear"></div>
</div>
<script type="text/javascript">
$(".default .jCarouselLite").jCarouselLite({
btnNext: ".default .next",
btnPrev: ".default .prev",
scroll: 1,
auto: 2000,
speed: 1000,
visible: 1
});
</script>
</div>
</div>
</div>
</div>
</div>
</body>
</html>