채택완료

코드 단축 질문드립니다.

2020-12-02 (수) 14:00:17 1,911

그누보드 관련 질문은 아니지만.. 

물어볼곳이 이곳뿐이라 도움을 요청합니다.

    var slide1_num = 0;    

/* 이전버튼 클릭하면 */
    $('.section5 .button-prev').click(function(){
        if(slide1_num <= 0){ 
            slide1_num = 7; 
        }else{
            slide1_num = slide1_num-1;
        }
        $('.gallery-top ul li').eq(slide1_num).stop().fadeIn(100).siblings().stop().fadeOut(100);
        $('.section5_thumbs li').eq(slide1_num).stop().animate({opacity:1}).siblings().stop().animate({opacity:0.4});
    });

슬라이드가 이런식으로 제이쿼리가 들어갑니다.

이전/다음 버튼을 누르면 >  썸네일과 사진이 바뀌어라  //// 는 위 코드를 구글링해서 했는데 

썸네일을 눌러도 사진이 바뀌는걸 하고싶습니다. 

$('.section5_thumbs li:eq(0)').click(function(){
        $(this).stop().animate({opacity:1});
        $(this).siblings().stop().animate({opacity:0.3});
        $('.gallery-top ul li:eq(0)').stop().fadeIn(100).siblings().stop().fadeOut(100);
    });

위와 같은 소스로 eq(0) ~ eq(7)까지 소스가 들어가있는데

소스가 너무 길어져서 한줄로 줄이고싶습니다.

혹시 도움 주실 분이 계실까요..? 

|

답변 1개 / 댓글 1개

채택된 답변
+20 포인트
2020-12-02 (수) 15:21:03

$('.section5_thumbs li').slice(0,8).on('click', function(){
    var idx = $(this).index();
    $(this).stop().animate({opacity:1});
    $(this).siblings().stop().animate({opacity:0.3});
    $('.gallery-top ul li').eq(idx).stop().fadeIn(100).siblings().stop().fadeOut(100);
});

답변에 대한 댓글 1개

2020-12-03 (목) 18:57:44
너무 감사합니다!

답변을 작성하려면 로그인이 필요합니다.