Mark
Mark

Reputation: 5653

Simple left right scrolling marquee

What is the lightest left-right scrolling marquee around?

I would prefer if it 'bounced'... by that I mean rather than going around in a loop it would be better that it scrolled left until it was all shown and then scrolled right.

I know its kinda retro... I am thinking of using it instead of truncating text.

Thanks.

Upvotes: 0

Views: 8147

Answers (2)

fredrik
fredrik

Reputation: 17617

You should be able to do this quite simple with jquery and some css:

// HTML 
<div id="myWrapperID" style="width: 300px;">
<div id="myElementID" style="float:left">[Lorem ipsum]</div>
</div>


// JS
(function (){
var ml,
    elem = $('#myElementID'),
    maxMarginLeft = $('#myWrapperID').width() - elem.width(),
    doMarquee = function () {
        ml = parseInt(elem.css('marginLeft'), 10) === 0 ? maxMarginLeft : 0;
        elem.animate({ marginLeft: ml + 'px' }, doMarquee);
    }

elem.css('marginLeft', '0px');
    doMarquee();    
}());

Upvotes: 0

Peter Di Cecco
Peter Di Cecco

Reputation: 1578

I suggest the Silky Smooth Marquee.

It uses the standard html marquee tag, so it will work without javascript enabled. However, with javascript enabled, it uses jquery to enhance the marquee and provides many customization options.

Here's the demo page.

Upvotes: 2

Related Questions