loktar00 / JQuery-Snowfall

Makes it snow on any web page or specific element.
http://loktar00.github.io/JQuery-Snowfall/
712 stars 221 forks source link

Multiple .snowfall() #13

Closed ghost closed 9 years ago

ghost commented 10 years ago

Having multiple snowfalls doesn't work, I'm guessing this is because of duplicate ID's on the flakes is there a work around? or fix?

ghost commented 10 years ago

For what I need I have figured a dirty fix for the time being.. as I want .snowfall() to be on different div's which aren't on the screen at the same time this bit of code works for me

// Snow Fall
var outside = jQuery('.scene3 .outside');
jQuery(function () {
    outside.data('switch', 'on');
});
jQuery(window).scroll(function () {
    if (jQuery(document).scrollTop() > 12500) {
        if (jQuery(outside).data('switch') == 'on') {
            jQuery(outside).data('switch', 'off');
            //Clear Scene1
            jQuery('.scene1').snowfall('clear');
            //Start Scene3
            jQuery(outside).snowfall({
                image :'/wp-content/themes/christmas/images/snow.png',
                flakeIndex: 28,
                minSize: 11,
                flakeCount: 10,
                maxSize:15
            });
        }
    } else {
        if (jQuery(outside).data('switch') == 'off') {
            jQuery(outside).data('switch', 'on');
            //Clear Scene3
            jQuery(outside).snowfall('clear');
            //Start Scene1
            jQuery('.scene1').snowfall({
                image :'/wp-content/themes/christmas/images/snow.png',
                flakeIndex: 28,
                minSize: 11,
                maxSize:15
            });
        }
    }
});
Silarn commented 9 years ago

I recently made a pull request to address this problem.

It does so by moving the flakes array to a global scope (within the plugin). Then, during creation and garbage collection, I carefully remove and fill in the associated flake ids from the global flakes array sorted by the id number.

This allows every snowflake to have a unique id so that the animation code works correctly and should also fill in old ids of erased flakes rather than continuing to create bigger and bigger id numbers.

Silarn commented 9 years ago

The pull request is #28 but I have not yet ported the jQuery code to the 'stock javascript' version.

Silarn commented 9 years ago

Both versions of the script should now work with multiple elements with my changes, see #28

loktar00 commented 9 years ago

:+1: thanks to the hard work by @Silarn this should be resolved and has been merged in.