我在这里进行了演示设置http://codepen.io/anon/pen/jqWxvm
此javascript中设置的限制在滚动的文本数量中设置的位置,它当前不显示li
的全部内容
jQuery(function(){
jQuery("ul#ticker01").liScroll();
});
jQuery.fn.liScroll = function(settings) {
settings = jQuery.extend({
travelocity: 0.17
}, settings);
return this.each(function() {
var $strip = jQuery(this);
$strip.addClass("newsticker")
var stripWidth = 1;
$strip.find("li").each(function(i) {
stripWidth += jQuery(this, i).outerWidth(true); // thanks to Michael Haszprunar and Fabien Volpi
});
var $mask = $strip.wrap("<div class='mask'></div>");
var $tickercontainer = $strip.parent().wrap("<div class='tickercontainer'></div>");
var containerWidth = $strip.parent().parent().width(); //a.k.a. 'mask' width
$strip.width(stripWidth);
var totalTravel = stripWidth + containerWidth;
var defTiming = totalTravel / settings.travelocity; // thanks to Scott Waye
function scrollnews(spazio, tempo) {
$strip.animate({
left: '-=' + spazio
}, tempo, "linear", function() {
$strip.css("left", containerWidth);
scrollnews(totalTravel, defTiming);
});
}
scrollnews(totalTravel, defTiming);
$strip.hover(function() {
jQuery(this).stop();
},
function() {
var offset = jQuery(this).offset();
var residualSpace = offset.left + stripWidth;
var residualTime = residualSpace / settings.travelocity;
scrollnews(residualSpace, residualTime);
});
});
};
答案 0 :(得分:0)
您可以尝试使用以下行修改CSS:
{{1}}
你可以玩&#34;宽度&#34;显示元素的属性。