본문 바로가기

분류 전체보기216

fullPage.js 에서 특정 인덱스일 때, 인덱스 이동할 때 이벤트 만들기 $(function() { $.fn.fullpage({ // 특정 인덱스일 때 'afterLoad': function (anchorLink, index) { if (index == 1){ alert ('첫번째 인덱스'); } }, // 페이지 이동할 때 'onLeave' : function (index, nextIndex, direction){ if (index == 3 && direction == 'down'){ alert ('3번에서 4번으로'); } else if (index == 3 && direction == 'up'){ alert ('3번에서 2번으로'); } } }); }); 2020. 4. 4.
오른쪽 마우스 클릭, 드래그 방지 2020. 4. 4.
[bxslider.js] 슬라이드 썸네일 thumbnail 1 / $(document).ready(function(){ var realSlider = $('.visual .slider').bxSlider({ auto: false, speed:1000, pager:false, control:false, infiniteLoop:true, hideControlOnEnd:true, nextSelector: '#slider-next3', prevSelector: '#slider-prev3', onSlideBefore:function($slideElement, oldIndex, newIndex){ changeRealThumb(realThumbSlider,newIndex); console.log($slideElement); }, onSlideAfter:function($sl.. 2020. 4. 4.
[bxsliderj.js] 반응형 width 설정하기 $('.main_fac > ul').bxSlider({ auto: false, pager: true, infiniteLoop: false, controls: false, shrinkItems: true, minSlides: 1, maxSlides: 4, slideWidth: 800, slideMargin: 25 }); ＃bxslider 옵션에 slideWidth값을 넣으면 스크린에 맞춰 반응형으로 줄어든다. 하지만, 이대로 써버리면 화면을 계속 줄였을 때 li의 width 값이 한없이 줄어들어서 문제... 그래서 해결책으로 모바일 사이즈가 될때까지는 li width 값을 직접 설정하고, 모바일 사이즈에서는 자동으로 설정되게 (모바일 사이즈보다 slideWidth 값이 커야 li값이 100%가 된다.) 했.. 2020. 4. 4.
FAQ 형식 slide Toggle var thisRsvnList = $(this).closest('.rsvn-list'); $('.rsvn-list').not(thisRsvnList).removeClass('on'); thisRsvnList.hasClass('on') ? thisRsvnList.removeClass('on') : thisRsvnList.addClass('on'); var thisToggle = $(this).closest('.rsvn-list').find('.room-toggle'); $('.rsvn-list').find('.room-toggle').not(thisToggle).slideUp(); thisToggle.slideToggle(); 2020. 4. 4.
여러 요소를 hide, show 할 때 높이 height 동일하게 하기 $("#nextPage").on("click", function(){ const popHeight = $("#service-fee1 .form-wrap").outerHeight(); //alert(popHeight); $("#service-fee1").hide(); $("#service-fee2 .form-wrap").css("height", popHeight); $("#service-fee2").show(); }); 2020. 4. 4.
breadcomb에 gnb 메뉴명 집어넣기 function gnbMenu(depth1, depth2){ var depth2 = depth2 - 1, depth1 = depth1 -1; $('.oneMenu').find('a.big').find('span').text($('.nav .nav_m li.menu:eq('+depth1+') > a').text()); $('.twoMenu').find('a.small').find('span').text($('.nav .nav_m li.menu:eq('+depth1+')').find('.nav2 li:eq('+depth2+') a').text()); $('.twoMenu').find('.downMenu').find('a').remove(); $('.twoMenu').find('.downMenu').appen.. 2020. 4. 3.
window width 따라 이벤트 발생시키기 function setType(){ if($(window).width() >= 720){ $('#slider-pc').show(); $('#slider-mobile').hide(); }else{ $('#slider-mobile').show(); $('#slider-pc').hide(); } } setType(); $(window).on("orientationchange load resize", function () { setType(); }); 2020. 4. 3.
[fullpage.js] 스크롤 했을 때 needpopup 사라지게 하기 $("#fullpage").fullpage({ onLeave: function(origin, destination, direction){ if($('.needpopup').hasClass('opened')){ $('html').removeClass('needpopup-opened').removeClass('needpopup-scrolled'); $('.needpopup').hide().removeClass('opened'); } } }); needpopup.js 에서 setTimeout(function(){ 안에 $(popup.html).addClass(popup.openHtmlClass); 추가! setTimeout(function(){ popup.target.addClass('opened'); $(p.. 2020. 4. 3.

티스토리툴바