테스트 사이트 - 개발 중인 베타 버전입니다

메인 슬라이드 속도 변경? 채택완료

아자12345 3년 전 조회 1,798

메인 슬라이드 속도를 변경하고 싶은데요..

 

어디를 수정해야 할까요??

 

.laIntro {
    width:100%;
    position:relative;
    padding:0;
}

.brand-heading {
    font-size: 2em;
}

.laIntro-text {
    font-size: 2em;
}

/* ====  slider ==== */
.sy-caption-wrap {
  position: absolute;
  bottom: 2em;
  top: 45%;
  z-index: 5;
  left: 50%;
  speed: 1000;    
}

.sy-caption-wrap .sy-caption {
  position: relative;
  left: -50%;
  background-color: transparent;
  color: #fff;
  text-shadow: -1px 0 1px #111;
  font-size: 3.2em;
  text-transform: uppercase;
  line-height: 1.1em;
  text-align: center;
  font-weight: 600;
  padding: 0;
    speed: 1000;
}
.sy-caption-wrap .sy-caption a {
    margin-top: 10px;
}
.sy-slide div a.slide-btn {
    
   border:1px solid #ff0000;
    margin-top: 30px;
}

.brand-heading {
    font-size: 20px;
}


@media (min-width: 979px) and (max-width: 1200px) {
    
    
}
@media (max-width: 767px) {
   
  .sy-controls {
    display: block;
  }
  .sy-controls li {
    min-width: 2.1em;
  }
  .sy-controls li a:after {
    width: 1.4em;
    height: 1.4em;    
  }
  .sy-caption-wrap .sy-caption {
      font-size:1.8em;
  }
}


@media (max-width: 480px) {
  .sy-caption-wrap {
    
    
  }
  .sy-caption-wrap .sy-caption {
    
  }
  
  .sy-caption-wrap .sy-caption {
      font-size:1.3em;
  }
}


@media (max-width: 360px) {

}
 

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

답변 3개

채택된 답변
+20 포인트
포이치
3년 전

별도의 사이트링크가 있으셨네요.

아래와 같은 부분을 찾으시어

주석으로 표시한부분을 추가하세요.

 

 

</p>

<p><script>

$(function(){

    $('ul#slippry').slippry({

        pager: false,</p>

<p><strong>        speed: 800,    //전환속도 추가 milliseconds</strong>

        onSliderLoad: function(index){

            $('ul#slippry > li').show();

            return this;

        },

        onSlideBefore: function(slide, old_index, new_index){

            var $object = $('ul#slippry > li').eq(new_index);

            var $h1_class = $object.find('h1').attr('rel');

            var $h2_class = $object.find('h2').attr('rel');

            var $h3_class = $object.find('h3').attr('rel');

            

            $object.find('h1').removeClass('animated').removeClass($h1_class).hide();

            $object.find('h2').removeClass('animated').removeClass($h2_class).hide();

            $object.find('h3').removeClass('animated').removeClass($h3_class).hide();

            

            return this;

        },

        onSlideAfter: function(slide, old_index, new_index){

            var $object = $('ul#slippry > li').eq(new_index);

            var $h1_class = $object.find('h1').attr('rel');

            var $h2_class = $object.find('h2').attr('rel');

            var $h3_class = $object.find('h3').attr('rel');

            

            $object.find('h1').show().addClass('animated').addClass($h1_class);

            $object.find('h2').show().addClass('animated').addClass($h2_class);

            $object.find('h3').show().addClass('animated').addClass($h3_class);

            

            return this;

        }

    });

});

</script></p>

<p>

로그인 후 평가할 수 있습니다

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

3년 전

css가 아니라 해당 슬라이드 js에서 수정하셔야 합니다

 

https://slippry.com/settings/에서 참고하세요

로그인 후 평가할 수 있습니다

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

포이치
3년 전

css 에서 수정하는건 아니고 영카트라면 사용하시는 테마의

skin/shop/basic/mainbanner.10.skin.php 파일의 (경로는 환경마다 틀려질수 있음)

하단쪽을 참조하시면 이런식으로 있을겁니다

 

</p>

<p>    var owl = $('.main_banner_owl').owlCarousel({</p>

<p>        items:1,</p>

<p>        loop:is_loop,</p>

<p>        margin:0,</p>

<p>        nav:false,</p>

<p>        autoHeight:true,</p>

<p>        autoplay:true,</p>

<p>        autoplayTimeout:5000,   // 5000은 5초</p>

<p>        autoplayHoverPause:true,</p>

<p>        dotsContainer: '.carousel-custom-dots',</p>

<p>        onChanged:function(event){</p>

<p>            owl_show_page(event);</p>

<p>        },</p>

<p>    });</p>

<p>

 

그런데 테마 마다 메인 롤링 플러그인을 사용하는게 틀릴수있으니

어떤테마를 사용하시는지를 정확히 알아야 도움을 드릴수 있을듯 합니다.

 

 

로그인 후 평가할 수 있습니다

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

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

로그인