如何将多个JQ向上滚动封装成一个长尾关键词？

本文共计1039个文字，预计阅读时间需要5分钟。

这段代码封装了两个向上滚动元素，如果其中一个元素的内容小于一屏，则不会滚动。代码如下：

css[代码]这段代码封装了两个向上滚动元素，如果其中一个元素的内容小于一屏，则不会滚动。

[代码]+CSS: 1. [代码] 这段代码封装了两个向上滚动元素，如果其中一个元素的内容小于一屏，则不会滚动。+CSS: 2. [代码] 这段代码封装了两个向上滚动元素，如果其中一个元素的内容小于一屏，则不会滚动。

这段代码封装了两个向上滚动，如果其中一个的内容小于一屏则不滚动；上代码：
CSS:

1.[代码]这段代码封装了两个向上滚动，如果其中一个的内容小于一屏则不滚动；上代码： CSS:

.showdebateBorder{width:770px;margin:44px auto 70px;} .showdebateBorder .showdebate_left{ float: left;width:410px;height:188px;overflow: hidden;border-right:1px solid red;} .showdebateBorder .showdebate_right{float: left;width:350px;height:188px;overflow: hidden;} .showdebateBorder .showdebate_right li{line-height: 24px;}

2.[代码]HTML:

<div class="showdebateBorder clearfix"> <div class="showdebate_left"> <ul class="debateList"> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> </ul> </div> <div class="showdebate_right"> <ul class="debateList"> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> <li>辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试辩论帖测试</li> </ul> </div> </div>

3.[代码]JS:

jQuery(function(){ var $ = jQuery; var leftDebateList = $(".showdebate_left .debateList"); var showdebate_leftHeight = parseInt($(".showdebate_left").css("height")); var leftDebateListHeight = parseInt($(".showdebate_left .debateList").css("height")); var rightDebateList = $(".showdebate_right .debateList"); var showdebate_rightHeight = parseInt($(".showdebate_right").css("height")); var rightDebateListHeight = parseInt($(".showdebate_right .debateList").css("height")); if(leftDebateListHeight > showdebate_leftHeight){ rolling(leftDebateList,leftDebateListHeight); } if(rightDebateListHeight > showdebate_rightHeight){ rolling(rightDebateList,rightDebateListHeight); } function rolling(obj,objheight){ var iHeight = 0; obj.append(obj.find("li").clone()); setInterval(function(){ iHeight -= 24; if(-iHeight > objheight){iHeight = 0;} obj.animate({"marginTop":iHeight}) },3000) } });