'순차적'에 해당되는 글 1건

  1. 2012.01.26 이미지 순차적으로 스위칭
web standard/jquery2012. 1. 26. 11:42
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta name="viewport" content="user-scalable=no, initial-scale = 1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width" />
<script type="text/javascript">
var num = 1;
$(document).ready(function() {
    $("div.tabCont > div.cont img").attr("src", "sian_"+num+".jpg");
    $("ul.paging li.prev").click(function() {
        num--;
        if (num < 0) {num = 0; };
        $("div.tabCont > div.cont img").attr("src", "sian_"+num+".jpg");
    });
    $("ul.paging li.next").click(function() {
        num++;
        var max=($("ul.tabMenu01 li").size())-1;
        $("div.tabCont > div.cont img").attr("src", "sian_"+num+".jpg");
    });
});
</script>
<style>
* {margin:0;padding:0;}
img {width:100%;border:none;}
</style>
</head>
<body>
<div class="tabCont">
    <div class="cont"><img src="sian_01.jpg" usemap="#link1" alt="" /></div>
</div>
<ul class="paging">
    <li class="prev">prev</li>
    <li class="next">next</li>
</ul>
</body>
</html>

'web standard > jquery' 카테고리의 다른 글

수평네비게이션 기초  (0) 2012.02.13
수직네비게이션 기초  (0) 2012.02.13
스크롤 따라다니는 퀵메뉴  (0) 2011.11.21
iframe 다루기  (0) 2011.11.16
로그인 입력폼 description 제어  (0) 2011.11.09
Posted by 수라