제이쿼리 반복해서 쓰고싶은데 도와주세요
본문
<script type="text/javascript">
(function($){
$.fn.extend({
Scroll:function(opt,callback){
if(!opt) var opt={};
var _this=this.eq(0).find("ul:first");
var lineH=_this.find("li:first").height(),
line=opt.line?parseInt(opt.line,10):parseInt(this.height()/lineH,10),
speed=opt.speed?parseInt(opt.speed,10):500,
timer=opt.timer?parseInt(opt.timer,10):3000;
if(line==0) line=1;
var upHeight=0-line*lineH;
scrollUp=function(){
_this.animate({
marginTop:upHeight
},speed,function(){
for(i=1;i<=line;i++){
_this.find("li:first").appendTo(_this);
}
_this.css({marginTop:0});
});
}
_this.hover(function(){
clearInterval(timerID);
},function(){
timerID=setInterval("scrollUp()",timer);
}).mouseout();
}
})
})(jQuery);
$(document).ready(function(){
$("#scrollDiv").Scroll({line:1,speed:500,timer:1000});
});
</script>
<div id="scrollDiv">
<ul>
<li>
<span>허OO</span>
<span>010-5496-****</span>
<span>인터넷</span>
</li>
<li>
<span>김OO</span>
<span>010-3856-****</span>
<span>인터넷 + 전화</span>
</li>
<li>
<span>이OO</span>
<span>010-6423-****</span>
<span>인터넷 + 전화</span>
</li>
<li>
<span>정OO</span>
<span>010-6853-****</span>
<span>인터넷 + TV</span>
</li>
<li>
<span>박OO</span>
<span>010-9856-****</span>
<span>인터넷</span>
</li>
<li>
<span>황OO</span>
<span>010-7548-****</span>
<span>인터넷 + 전화</span>
</li>
<li>
<span>이OO</span>
<span>010-8842-****</span>
<span>인터넷</span>
</li>
<li>
<span>허OO</span>
<span>010-5496-****</span>
<span>인터넷</span>
</li>
<li>
<span>김OO</span>
<span>010-6458-****</span>
<span>인터넷 + 전화</span>
</li>
<li>
<span>박OO</span>
<span>010-3458-****</span>
<span>인터넷 + 전화</span>
</li>
</ul>
</div>
이걸 한페이지에서 두개쓰고 싶은에 하나만 작동 하네요 ㅠㅠ
답변 1
아래처럼 하면 어떤가요?
$(document).ready(function(){
$("#scrollDiv").Scroll({line:1,speed:500,timer:1000});
$("#scrollDiv2").Scroll({line:1,speed:500,timer:1000});
});
<div id="scrollDiv">
</div>
<div id="scrollDiv2">
</div>