PDA

View Full Version : sprite sequencer/rollover



wwfc
08-26-2015, 03:04 PM
hi all,

i am working on something that i am using sprite sequencer and sprite rollover scripts for.
at the moment it plays the sprite animation just fine - but what i want to do is to play the sprites as a loop not just from the first frame to the last - so it looks like a constant movement...
ideally the rollover would trigger the sprite sequence to play and loop until the mouse moves out of the area - and then the sprites would carry on until a specific frame (either first or last of the sprite sheet)...

how do i declare this in the following code?


<script type="text/javascript" charset="utf-8">

$(document).ready(function() {

$('#sprite').spriteSequencer({
spriteSheet: "sprite_sheet.png",
columns: 30,
totalFrames: 30,

fps: 30,
width: 500,
height: 281,
onTick: currentFrame
})

$('#play').click(function() {
$('#sprite').spriteSequencer('loop')
});

$('#pause').click(function() {
$('#sprite').spriteSequencer('pause')
});

$('#gotostop').click(function() {
$('#sprite').spriteSequencer('gotoAndStop', {frame: 20})
});

$('#gotoplay').click(function() {
$('#sprite').spriteSequencer('gotoAndPlay', {frame: 10})
});

$('#playto').click(function() {
$('#sprite').spriteSequencer('playTo', {frame: 5})
});

});

function currentFrame (frame) {
$('#current-frame').html("Current frame: "+ frame)
}

</script>


any ideas? hope that i'm not being too vague - but the code above is basically the thing that drives it all...

here's hoping!
;-)

Beverleyh
08-26-2015, 06:07 PM
I've never heard of sprite sequencer or rollover, but I surmise from the syntax they're jQuery plugins?

To be honest, there isnt much that anyone can help you with from the information you've supplied; being able to help would hinge on a knowledge of the plugin(s), and their syntax/inits/parameters/callbacks, etc.

I think you would be better off seeking help from the plugin(s) developer or possibly the jQuery community. If you'd like to continue to pursue help here, you should provide links to the plugin(s) source pages, demos and documentation. Maybe somebody will digest them for you and help you work through it.

coothead
08-26-2015, 06:22 PM
....and a glimpse of your "sprite_sheet.png" image might prove enlightening and helpful. ;)


coothead

dog
09-04-2015, 10:13 PM
Hi wwfc,

Without knowing what spriteSequencer does and working off assumptions this is a bit of a shot in the dark:




$(document).ready(function() {

$('#sprite').spriteSequencer({
spriteSheet: "sprite_sheet.png",
columns: 30,
totalFrames: 30,

fps: 30,
width: 500,
height: 281,
onTick: currentFrame
});

// Bind mouse enter
$('#sprite').mouseenter(function(){
$('#sprite').spriteSequencer('gotoAndPlay', {frame: 1});
});

// Bind mouse exit
$('#sprite').mouseleave(function(){
$('#sprite').spriteSequencer('gotoAndStop', {frame: 1});
});

$('#play').click(function() {
$('#sprite').spriteSequencer('loop'); // Does 'loop' work?
});

$('#pause').click(function() {
$('#sprite').spriteSequencer('pause');
});

$('#gotostop').click(function() {
$('#sprite').spriteSequencer('gotoAndStop', {frame: 20});
});

$('#gotoplay').click(function() {
$('#sprite').spriteSequencer('gotoAndPlay', {frame: 10});
});

$('#playto').click(function() {
$('#sprite').spriteSequencer('playTo', {frame: 5});
});

});

function currentFrame (frame) {
$('#current-frame').html("Current frame: "+ frame);

// Loop
if(frame === totalFrames) {
if()
$('#sprite').spriteSequencer('gotoAndPlay', {frame: 1});
}
};


I'm assuming the 'loop' behaviour triggered by the clicking #play isn't working for you, it that right? Anyway, I've suggested putting a check in the currentFrame method to check if the current frame is equal to the total frames. However, I don't know if totalFrame is available to that method and it needs to be. If you know there are always 30 frames then you could hardcode frame === 30 and do away with the totalFrames variable there.

I've also suggested how you'd bind the mouseenter and mouseleave events. But as I said before this is under the assumption that those methods are working. Are your supposed "play", "pause", "gotoplay" and "gotostop" buttons working?

If my suggestion doesn't help, I think you'll need to provide more info about spriteSequencer and perhaps show the HTML on the page - in case you have any bugs there.

Cheers!