[jQuery] Help refactoring code for css sprite animation

[jQuery] Help refactoring code for css sprite animation


Sorry if I posted this twice, I've just joined and got told I couldn't post
messages by google groups. Think I have joined properly now though.
I have a css sprite which I have finally managed to figure out how to
animate. All is well, except that there is a lot of repetition in the code
and my Software Engineering background is screaming at me telling me to
refactor and get rid of the duplication in the code.
<code>
$(document).ready(function(){
$('#mjcwalk').css( {backgroundPosition: '0 0'} )
.fadeOut('slow', function() { $(this).css(
{backgroundPosition: '-500 0'} ).show()
.fadeOut('slow', function() { $(this).css(
{backgroundPosition: '-1000 0'} ).show()
            .fadeOut('slow', function() { $(this).css( {backgroundPosition:
'-1500 0'} ).show()
            .fadeOut('slow', function() { $(this).css( {backgroundPosition:
'-2000 0'} ).show()
            .fadeOut('slow', function() { $(this).css( {backgroundPosition:
'-2500 0'} ).show()
            });
            });
            });
            });
         });    
        });
</code>
What I though I could do was to create a nice for loop and call the same
function over and over again, but can I for the life of me figure out how to
do it.
Please could someone help me refactor this code into a function as have
tried and tried to figure it out form myself and am getting no where.
Thanksmj@mjcltd.net
--
View this message in context: http://www.nabble.com/Help-refactoring-code-for-css-sprite-animation-tp19597457s27240p19597457.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.



































    • Topic Participants

    • mg