• 카테고리

    질문 & 답변
  • 세부 분야

    웹 개발

  • 해결 여부

    미해결

PC에서 모바일화면으로 전환되면 GNB 메뉴가 OPEN되어있는 상태 (소스 js)2

24.02.16 11:55 작성 조회수 75

2

  /* document ready랑 같은거 = html을 다 읽은 후 실행해라고 표시 */
  /* Trigger */
$(function(){

  $('.trigger').click(function(){
    $(this).toggleClass('active')
    $('.gnb').toggleClass('active')
  })
  $('section, .menu a').click(function(){
    $('.gnb').removeClass('active')
    $('.trigger').removeClass('active')
  })

  /* smooth Scrolling */
  $('.menu a, .gototop').click(function(e){
    $.scrollTo(this.hash || 0, 900)
   })

   /* chacng CSS with Scroll */
   // 스크롤을 한 상태 if 스크롤을 안한상태 else
   $(window).scroll(function(){
    if($(window).scrollTop() > 50) {
      $('header, .gototop').addClass('active')
    }
    else {
      $('header, .gototop').removeClass('active')
    }
   })

   // slick.js History
   $('.history-slider').slick({
    dots: true,
    infinite: true,
    speed: 300,
    slidesToShow: 4,
    slidesToScroll: 2,
    responsive: [
      {
        breakpoint: 1024,
        settings: {
          slidesToShow: 3,
          slidesToScroll: 3,
          infinite: true,
          dots: true
        }
      },
      {
        breakpoint: 600,
        settings: {
          slidesToShow: 2,
          slidesToScroll: 2
        }
      },
      {
        breakpoint: 480,
        settings: {
          slidesToShow: 1,
          slidesToScroll: 1
        }
      }
      // You can unslick at a given breakpoint now by adding:
      // settings: "unslick"
      // instead of a settings object
    ]
   })


   // slick.js project photo1
   $('.project-photo').slick({
    dots : true,
    infinite : true,
    speed : 500,
    fade : true,
    autoplay : true,
    autoplaySpeed : 2000,
    cssEase : 'linear'
   })

})

답변 1

답변을 작성해보세요.

0

첫번째 질문에 답변 올렸습니다. 확인해주세요~

audlovewns님의 프로필

audlovewns

질문자

2024.02.19

감사합니다 :)