jQuery Plug-in slide_left
2021. 12. 20. 11:44ㆍStudy/Example & Plug-in
jQuery Plug-in slide_left
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body{margin:50px;}
.partner{width:945px; clear:both; overflow:hidden; border:1px solid #999;}
.partner li img{border:0;}
.simply-scroll-clip{position:relative; overflow:hidden}
.simply-scroll-list{overflow:hidden; margin:0; padding:0; list-style:none}
.simply-scroll-list li{margin-right:4px; float:left; width:105px; height:33px}
.simply-scroll .simply-scroll-clip{width:945px; height:33px}
</style>
<script src="js/jquery-1.7.1.min.js" ></script>
<script src="js/jquery.simplyscroll.js"></script>
<script>
$(document).ready(function(){
$("#scroller").simplyScroll();
});
</script>
</head>
<body>
<div class="partner">
<ul id="scroller">
<li class="p1"><a href="#" title="환경부 새창으로 열림" target="_blank"><img src="images/partner1.jpg" alt="" /></a></li>
<li class="p2"><a href="#" title="한국환경산업기술원 새창으로 열림" target="_blank"><img src="images/partner2.jpg" alt="" /></a></li>
<li class="p3"><a href="#" title="녹색성장 새창으로 열림" target="_blank"><img src="images/partner3.jpg" alt="" /></a></li>
<li class="p4"><a href="#" title="그린스타트 새창으로 열림" target="_blank"><img src="images/partner4.jpg" alt="" /></a></li>
<li class="p5"><a href="#" title="기후변화홍보포털 새창으로 열림" target="_blank"><img src="images/partner5.jpg" alt="" /></a></li>
<li class="p6"><a href="#" title="녹색성장포럼 새창으로 열림" target="_blank"><img src="images/partner6.jpg" alt="" /></a></li>
<li class="p7"><a href="#" title="국토해양부 새창으로 열림" target="_blank"><img src="images/partner7.jpg" alt="" /></a></li>
<li class="p8"><a href="#" title="Green Growth 새창으로 열림" target="_blank"><img src="images/partner8.jpg" alt="" /></a></li>
<li class="p9"><a href="#" title="SINGG 새창으로 열림" target="_blank"><img src="images/partner9.jpg" alt="" /></a></li>
</ul>
</div>
</body>
</html>
'Study > Example & Plug-in' 카테고리의 다른 글
| jQuery Plug-in responsiveGallery_sample (0) | 2021.12.20 |
|---|---|
| jQuery Plug-in coin-slider (0) | 2021.12.20 |
| jQuery Plug-in accordion (0) | 2021.12.20 |
| jQurey Plug-in fadeBanner (0) | 2021.12.20 |
| jQuery Plug-in move_banner (0) | 2021.12.20 |
