jQuery: Background-Position Animation Plugin

How to use:

$('#background').animate({backgroundPosition: '10% 250px'});

Example:

$('#background') .click(function(){ $(this) .animate({backgroundPosition: '500px 150px'}) .animate({backgroundPosition: '-20px 250px'}) ; });

Klick me

Known Issue

Due to a bug in FF 2.0, you have to set your (initial) background-position inline:

<div style="background-position: 10px 20px"></div>

Offcurse you can achieve this with JavaScript (jQuery), too:

$('#background').css({backgroundPosition: '10px 20px'});

If you donĀ“t set the inline-Style the script will degrade gracefully in FF 2.

Back to protofunc