자바스크립트 if 문 어디에 넣어야 할까요 ㅠㅠ
본문
안녕하세요~~ 디자이너로 일하고 있는 사람입니다.
슬라이드 소스를 받아와서, 원하는 디자인으로 수정하는중인데....
숫자가 붙는것을 출력값을 텍스트로 바꾸고 싶은데.. if 문 어디에 어떻게 해야 할지 모르겠어요
지금 i++ 로 숫자가 자동으로 더해져서, 1,2,3,4 가 출력되고 있는데...
if 문으로 i = 1 이면 어쩌구저쩌구... i=2 면.. 블라블라 이런식으로 해당 위치의 숫자를 텍스트로 바꾸고 싶어요.
아래는 소스 입니다.
도와주세효오오오옹 ~~~~~~~~~~~~ ㅠ.ㅠ
--- 스크립트 --
<script type="text/javascript">
$(function() {
var sWidth = $("#focus").width();
var len = $("#focus ul li").length;
var index = 0;
var picTimer;
var btn = "<div class='btnBg'></div><div class='btn'>";
for(var i=0; i < len; i++) {
btn += "<span>" + (i+1) + "</span>";
}
btn += "</div>"
$("#focus").append(btn);
$("#focus .btnBg").css("opacity",0.5);
$("#focus .btn span").mouseenter(function() {
index = $("#focus .btn span").index(this);
showPics(index);
}).eq(0).trigger("mouseenter");
$("#focus ul").css("width",sWidth * (len + 1));
$("#focus ul li div").hover(function() {
$(this).siblings().css("opacity",0.7);
},function() {
$("#focus ul li div").css("opacity",1);
});
$("#focus").hover(function() {
clearInterval(picTimer);
},function() {
picTimer = setInterval(function() {
if(index == len) {
showFirPic();
index = 0;
} else {
showPics(index);
}
index++;
},3000);
}).trigger("mouseleave");
function showPics(index) {
var nowLeft = -index*sWidth;
$("#focus ul").stop(true,false).animate({"left":nowLeft},500);
$("#focus .btn span").removeClass("on").eq(index).addClass("on")
}
function showFirPic() {
$("#focus ul").append($("#focus ul li:first").clone());
var nowLeft = -len*sWidth;
$("#focus ul").stop(true,false).animate({"left":nowLeft},500,function() {
$("#focus ul").css("left","0");
$("#focus ul li:last").remove();
});
$("#focus .btn span").removeClass("on").eq(0).addClass("on");
}
});
</script>
-- html ---
<div class="wrapper">
<div id="focus">
<ul>
<li>
<div style=" margin:0px; left:-40px; top:0; width:980px; height:320px;"><a href="#" target="_blank"><img src="1.jpg" alt="" /></a></div>
</li>
<li>
<div style="margin:0px; left:-40px; top:0; width:980px; height:320px;"><a href="#" target="_blank"><img src="2.jpg" alt="" /></a></div>
</li>
<li>
<div style="margin:0px; left:-40px; top:0; width:980px; height:320px;"><a href="#" target="_blank"><img src="3.jpg" alt="" /></a></div>
</li>
<li>
<div style="margin:0px; left:-40px; top:0; width:980px; height:320px;"><a href="#" target="_blank"><img src="4.jpg" alt="" /></a></div>
</li>
</ul>
</div>
</div>
답변 2
for(var i=0; i < len; i++) {
btn += "<span>" + (i+1) + "</span>";
}
이부분을
for(var i=0; i < len; i++) {
text = '';
if(i == 0 ){
text = '원하는텍스트';
}else if(i == 1){
text = '원하는텍스트';
}
btn += "<span>" + text + "</span>";
}변경하시면됩니다.
빠른 답변 주셔서 정말 감사합니다 !!!
지식인 보다 더 빨랐어요, 정말 감사해요~~ ^^
vat btn 위에
var txt = new Array();
txt[0] = "abc";
txt[1] ="qwe";
이런식으로 글을 넣고
(i+1)을 txt[i] 로 고치세요
var txt = new Array();
txt[0] = "abc";
txt[1] ="qwe";
이런식으로 글을 넣고
(i+1)을 txt[i] 로 고치세요
오오오 더 간단하네요 !!!
위에 채택하고 나니... 댓글이 하나 더 달렸네요
감사합니다 !!!
감사해요 정말 ~~ ㅠㅠ
답변을 작성하시기 전에 로그인 해주세요.
