이미지 슬라이드 n = 1;var slide_w = $('#content01 ul#slider li').width();var slide_cnt = $('#content01 ul#slider li').size();var sliderOn = 'img/ico_slider_on.png'var sliderOff = 'img/ico_slider.png' $('a#nextBtn').click(function(){n++;if(n==slide_cnt){$('#content01 ul#slider').css({marginLeft:-slide_w * 1});n=2}$('#content01 ul#slider').stop().animate({marginLeft:-slide_w * n});// navdot$('#content01 ul#navdot.. 퍼블리싱/TIP 9년 전
isScrolledView moveUp 차례대로 효과주기 #section03 ul li:first-child{ -webkit-animation:moveUp 0.6s 0.5s forwards; animation:moveUp 0.6s 0.5s forwards; animation-play-state: paused; opacity: 0;}#section03 ul li:nth-child(2){ -webkit-animation:moveUp 0.6s 1.5s forwards; animation:moveUp 0.6s 1.5s forwards; animation-play-state: paused; opacity: 0;}#section03 ul li:last-child{ -webkit-animation:moveUp 0.6s 2.5s forwards; animation:moveU.. 퍼블리싱/TIP 9년 전
scrollTop값을 이용한 엘리먼트 움직이는 효과 STEP. 1function isScrolledIntoView(elem) {var docViewTop = $(window).scrollTop(); var docViewBottom = docViewTop + $(window).height(); var elemTop = $(elem).offset().top; var elemBottom = elemTop + $(elem).height(); return ((elemBottom >= docViewTop) && (elemTop 퍼블리싱/TIP 9년 전
마우스 휠 이벤트 - 원페이지 (mousewheel event - onepage) mousewheel event마우스 휠을 이용한 인터랙션이다.원페이지형식에 응용하였으며 휠을 내리거나 올릴때 하나의 화면이 통으로 슬라이드 되도록 하였다.javascript123456789101112131415161718192021222324252627var win_h = $(window).height(); $('.section').each(function(index){ $(this).attr("data-index",win_h * index); }); $('.section').on("mousewheel",function(e){ var sectionPos = parseInt($(this).attr("data-index")); if(e.originalEvent.wheelDelta >= 0) { $("html.. 퍼블리싱/TIP 9년 전
