fadein 효과를 사용한 2번째 예제입니다.
<ul id="scroll">
<li id="main_img_img0" style="position:absolute;z-index:10;top:0px;left:0;width:100%;"><img src="images/common/visual1.jpg" title="" alt=""></li>
<li id="main_img_img2" style="position:absolute;z-index:11;top:0px;left:0;width:100%;display:none;"><img src="images/common/visual2.jpg" title="" alt=""></li>
<li id="main_img_img3" style="position:absolute;z-index:11;top:0px;left:0;width:100%;display:none;"><img src="images/common/visual3.jpg" title="" alt=""></li>
</ul>
<script type="text/javascript">
//<![CDATA[
var s = null;
var j = 1;
var times = 4000;
function TiVis(){
clearInterval(s);
ButtonClear();
if( j == 0 ){ $("#main_img_img0").css({zIndex : 13});$("#main_img_img2").hide(); $("#main_img_img_tab1").attr('src','images/common/main_img_on.gif');$("#main_img_img0").fadeIn(1000);}
if( j == 1 ){ $("#main_img_img0").css({zIndex : 10});$("#main_img_img0").hide(); $("#main_img_img3").hide(); $("#main_img_img_tab2").attr('src','images/common/main_img_on.gif');$("#main_img_img2").fadeIn(1000);}
if( j == 2 ){ $("#main_img_img_tab3").attr('src','images/common/main_img_on.gif'); $("#main_img_img3").fadeIn(1000); }
j++;
if(j==3) {
j=0;
}
s = setInterval( "TiVis()", times );
}
window.onload = function(){
/*$("#main_img_img0").css({zIndex : 10});
$("#main_img_img2").css({zIndex : 11});
$("#main_img_img3").css({zIndex : 12});*/
$("#main_img_img_tab1").css({cursor:'pointer'});
$("#main_img_img_tab2").css({cursor:'pointer'});
$("#main_img_img_tab3").css({cursor:'pointer'});
s = setInterval( "TiVis()", times );
}
function ButtonClear(){
$("#main_img_img_tab1").attr('src','images/common/main_img_off.gif');
$("#main_img_img_tab2").attr('src','images/common/main_img_off.gif');
$("#main_img_img_tab3").attr('src','images/common/main_img_off.gif');
}
$(document).ready(function(){
$(".number_tab img").click(function(){
j = Number($(this).val());
if( j == 1 ){ $("#main_img_img0").css({zIndex : 13});$("#main_img_img2").hide();}
if( j == 2 ){ $("#main_img_img0").css({zIndex : 10});$("#main_img_img0").hide(); $("#main_img_img3").hide();}
ButtonClear();
TiVis();
});
});
//]]>
</script>
댓글 4개
게시판 목록
팁게시판
질문은 상단의 QA에서 해주시기 바랍니다.
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 5502 | 11년 전 | 3869 | ||
| 5501 | 11년 전 | 1151 | ||
| 5500 |
잘살아보자
|
11년 전 | 910 | |
| 5499 |
kiplayer
|
11년 전 | 7447 | |
| 5498 |
잘살아보자
|
11년 전 | 2316 | |
| 5497 |
잘살아보자
|
11년 전 | 1134 | |
| 5496 |
잘살아보자
|
11년 전 | 1175 | |
| 5495 |
잘살아보자
|
11년 전 | 964 | |
| 5494 |
잘살아보자
|
11년 전 | 4563 | |
| 5493 |
잘살아보자
|
11년 전 | 684 | |
| 5492 |
잘살아보자
|
11년 전 | 5244 | |
| 5491 |
잘살아보자
|
11년 전 | 3383 | |
| 5490 | 11년 전 | 1201 | ||
| 5489 |
|
11년 전 | 3281 | |
| 5488 |
잘살아보자
|
11년 전 | 2825 | |
| 5487 |
잘살아보자
|
11년 전 | 2201 | |
| 5486 |
잘살아보자
|
11년 전 | 1443 | |
| 5485 |
잘살아보자
|
11년 전 | 1455 | |
| 5484 |
잘살아보자
|
11년 전 | 2338 | |
| 5483 |
잘살아보자
|
11년 전 | 3244 | |
| 5482 |
잘살아보자
|
11년 전 | 1133 | |
| 5481 |
잘살아보자
|
11년 전 | 743 | |
| 5480 |
잘살아보자
|
11년 전 | 1367 | |
| 5479 |
잘살아보자
|
11년 전 | 685 | |
| 5478 |
잘살아보자
|
11년 전 | 1266 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기