Jump to content

Fade Newsticker


mkessler

Recommended Posts

Need help fading the edges of my jquery newsticker so it looks as if the text is fading in and out of the page as it scrolls. Anyone know how to accomplish this?Script:

jQuery.fn.liScroll = function(settings) {		settings = jQuery.extend({		travelocity: 0.07		}, settings);				return this.each(function(){				var $strip = jQuery(this);				$strip.addClass("newsticker")				var stripWidth = 0;				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.find("li").each(function(i){				stripWidth += jQuery(this, i).outerWidth(true); // thanks to Michael Haszprunar				});				$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);				});					});	};

Call:

$(function(){ $("ul#ticker01").liScroll(); }); 

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...