제이쿼리 슬라이드 시작부분 고정에 관련 질문드리겠습니다.
본문
var leftCt = 0;
$(function(){
$("#imgList").attr("top", "0");
imgStart("R");
});
function imgStart(tp){
clearInterval($("#imgList").attr("timer"));
if(tp == "R"){ // 오른쪽 이동
imgRight();
$("#imgList").attr("timer", setInterval("imgRight()", 4000)); // 멈춰있는 시간
}else{ // 왼쪽이동
if(leftCt == 0){
var leng = $("#imgList div").size();
$("#imgList").css("left",parseInt($("#imgList div").eq(0).width()*-1));
$("#imgList>.rollingImg").eq(parseInt(leng-1)).clone().prependTo($("#imgList"));
$("#imgList>.rollingImg").eq(leng).remove();
leftCt = 1;
}
imgLeft();
$("#imgList").attr("timer", setInterval("imgLeft()", 3000));
}
}
function imgRight(){
$("#imgList").animate({
left : parseInt($("#imgList .rollingImg").eq(0).width() * -1)
},300,function(){
$("#imgList").css("left", "0px");
$("#imgList>.rollingImg").eq(0).clone().appendTo($("#imgList"));
$("#imgList>.rollingImg").eq(0).remove();
});
}
function imgLeft(){
var leng = $("#imgList .rollingImg").size();
$("#imgList").animate({
left : 0
},300,function(){
$("#imgList").css("left", "0px");
$("#imgList").css("left",parseInt($("#imgList .rollingImg").eq(0).width()*-1));
$("#imgList>.rollingImg").eq(parseInt(leng-1)).clone().prependTo($("#imgList"));
$("#imgList>.rollingImg").eq(leng).remove();
});
}
위 제이쿼리 소스이구요
상품이 여러개가 슬라이드되는 형식인데요
OOOOO
이런식으로 상품이 있으면
5개중 젤 처음 상품이 너무 바로 넘어가버려서 실제론 두번째 상품부터 보이게 됩니다.
혹시 시작부를 고정 시키는 방법이 있을까요?
좋은 하루 되세요!
답변 1
$(function(){
$("#imgList").attr("top", "0");
imgStart("R");
});
이 부분을
$(function(){
$("#imgList").attr("top", "0");
setTimeout(function(){
imgStart("R");
},4000);
});
이렇게 바꾸면
바로 해결되었습니다. 정말 감사합니다!! :)