jquery
이미지 좌우클릭
aneyh.c
2012. 2. 17. 18:33
간단한 for문 사용
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta name="keywords" content="카르테 GSP,carte,carte gsp" />
<meta name="subject" content="카르테 GSP" />
<meta name="description" content="카르테 GSP" />
<meta name="author" content="카르테" />
<meta name="copyright" content="ONNET CO.,LTD" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="-1" />
<title>Carte GSP</title>
<link rel="stylesheet" type="text/css" href="gsp_0215.css" />
<script language="javascript" src="http://img.gamescampus.co.kr/js/jquery/jquery-1.5.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var pi;
pi = $(".sc_img").attr("id");
$(".sleft").css("display","none");
$(".sright").click(function(event) {
$(".sleft").css("display","inline-block");
if(pi < 4)
{
pi = ++pi;
$(".sc_img").attr("src","images/s"+pi+".jpg");
}
if (pi >= 4)
{
$(this).css("display","none");
}
return false;
});
$(".sleft").click(function(event) {
$(".sright").css("display","inline-block");
if(pi > 1)
{
pi = --pi;
$(".sc_img").attr("src","images/s"+pi+".jpg");
}
if(pi <= 1)
{
$(this).css("display","none");
}
return false;
});
});
</script>
</head>
<body>
<div id="gsp_tit_wrap">
<div class="gsp_tit">
<a class="logotxt" href="http://carte.gamescampus.co.kr">카르테</a>
<p class="swf1">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="100%" height="72">
<param name="movie" value="1280_72.swf" />
<param name="wmode" value="transparent" />
<!--[if !IE]>-->
<embed src="1280_72.swf" quality="high" pluginspage="" type="application/x-shockwave-flash" width="100%" height="72" wmode="transparent"></embed>
<!--<![endif]-->
</object>
</p>
</div>
</div><!-- gsp_tit_wrap -->
<div id="gsp_info_wrap">
<div class="gsp_info">
<p class="swf2">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="100%" height="180">
<param name="movie" value="1280_180.swf" />
<param name="wmode" value="transparent" />
<!--[if !IE]>-->
<embed src="1280_180.swf" quality="high" pluginspage="" type="application/x-shockwave-flash" width="100%" height="180" wmode="transparent"></embed>
<!--<![endif]-->
</object>
</p>
</div>
</div><!-- gsp_info_wrap -->
<div id="gsp_nation_wrap">
<div class="gsp_nation">
<a href="http://carte.gamescampus.eu/" class="ger"><span>독일</span></a>
<a href="http://carte.gamescampus.com/teaser" class="usa"><span>미국</span></a>
<a href="http://carte.gamescampus.co.kr/" class="kor"><span>한국</span></a>
<a href="#" class="jpn"><span>일본</span></a>
</div>
</div>
<div id="gsp_screen_wrap">
<div class="gsp_screen">
<div class="s_box">
<span class="lef">
<a href="#" class="sleft"><img src="images/btn_left.jpg" alt="" /></a>
</span>
<img src="images/s1.jpg" id="1" class="sc_img" alt="" />
<span>
<a href="#" class="sright"><img src="images/btn_right.jpg" alt="" /></a>
</span>
</div>
<span class="txt1">
※ 오픈 일정 및 GSP방식은 변경될 수 있으며, 변경 시 공지를 통해 안내 드리겠습니다.
</span>
<span class="txt2">
<label for="aa" style="cursor:pointer;">일주일 동안 이 창을 다시 열지 않음</label> <input type="checkbox" id="aa" />
</span>
</div>
</div>
</body>
</html>