-
위로올라가는 슬라이드 형식 스크립트JAVASCRIPT 2020. 4. 22. 10:23
<script> function fn_article(containerID, autoStart){ var $element = $('#'+containerID).find('.notice-ul'); var autoPlay = autoStart; var auto = null; var speed = 2000; var timer = null; var move = $element.children().outerHeight(); var first = false; var lastChild; lastChild = $element.children().eq(-1).clone(true); lastChild.prependTo($element); $element.children().eq(-1).remove(); if($element.children().length==1){ $element.css('top','0px'); }else{ $element.css('top','-'+move+'px'); } if(autoPlay) { timer = setInterval(moveNextSlide, speed); auto = true; } $element.find('td').bind({ 'mouseenter': function(){ if(auto){ clearInterval(timer); } }, 'mouseleave': function(){ if(auto){ timer = setInterval(moveNextSlide, speed); } } }); function moveNextSlide(){ $element.each(function(idx){ var firstChild = $element.children().filter(':first-child').clone(true); firstChild.appendTo($element.eq(idx)); $element.children().filter(':first-child').remove(); $element.css('top','0px'); $element.eq(idx).animate({'top':'-'+move+'px'},'normal'); }); } } fn_article("olinenotice", true); </script> #olinenotice {position:relative;overflow:hidden;height:375px} .notice-ul{position:absolute; top:0px;width:100%;}
'JAVASCRIPT' 카테고리의 다른 글
javascript sprintf 02d (0) 2020.06.01 원하는 영역만 프린트하기 (0) 2020.05.28 javascript 날짜 시간 계산 (0) 2020.05.28 구글트랜스 (홈페이지 번역) (0) 2020.05.15 구글트랜스 (홈페이지 번역) 아이콘언어변경 (0) 2020.05.06