/**
* Created by Jeon on 2018-05-04.
*/
var visualImg = $('.v_img img');
var vBtnLi = $(".v_btn_li");
var buttonIndex = 0;
//기초 세팅
function nextImg() {
var previousButtonIndex = buttonIndex;
if(buttonIndex == visualImg.length -1) {
buttonIndex = 0;
} else {
buttonIndex ++;
}
//ì´ì „ ì¸ë±ìŠ¤ opacity = 0 으로, 올ë¼ì˜¬ ì¸ë±ìŠ¤ opacity = 1ë¡œ 바꿔준다.
visualImg.eq(previousButtonIndex).animate({"opacity":0},1000);
visualImg.eq(buttonIndex).animate({"opacity":1},1000);
//ì´ì „ ì¸ë±ìŠ¤ width 12, background = white 현재 ì¸ë±ìŠ¤ width 40 back e7302a
vBtnLi.eq(previousButtonIndex).animate({"width":12+"px"},1000);
vBtnLi.eq(buttonIndex).animate({"width":40+"px"},1000)
vBtnLi.eq(previousButtonIndex).css({"background":"#FFF"});
vBtnLi.eq(buttonIndex).css({"background":"#e7302a"})
vBtnLi.eq(buttonIndex).addClass("v_btn_on");
vBtnLi.eq(previousButtonIndex).removeClass("v_btn_on");
}
vBtnLi.click(function() {
if(buttonIndex != vBtnLi.index(this)) {
var previousButtonIndex = buttonIndex;
buttonIndex = vBtnLi.index(this);
console.log("now Image Index : " + buttonIndex);
console.log("now button Index : " + buttonIndex);
//ì´ì „ ì¸ë±ìŠ¤ opacity = 0 으로, 올ë¼ì˜¬ ì¸ë±ìŠ¤ opacity = 1ë¡œ 바꿔준다.
visualImg.eq(previousButtonIndex).animate({"opacity":0},1000);
visualImg.eq(buttonIndex).animate({"opacity":1},1000);
//ì´ì „ ì¸ë±ìŠ¤ width 12, background = white 현재 ì¸ë±ìŠ¤ width 40 back e7302a
vBtnLi.eq(previousButtonIndex).animate({"width":12+"px"},1000);
vBtnLi.eq(buttonIndex).animate({"width":40+"px"},1000);
vBtnLi.eq(previousButtonIndex).css({"background":"#FFF"});
vBtnLi.eq(buttonIndex).css({"background":"#e7302a"});
vBtnLi.eq(buttonIndex).addClass("v_btn_on");
vBtnLi.eq(previousButtonIndex).removeClass("v_btn_on");
clearInterval(autoSlider);
autoSlider = setInterval(function() {
nextImg();
},4000);
}
});
var autoSlider = setInterval(function() {
nextImg();
},4000);
//e7302a ,40*12 12*12