How to destroy Sliderkit and create one again?

251 views
Skip to first unread message

io.ht...@gmail.com

unread,
Jul 19, 2012, 6:49:02 PM7/19/12
to slid...@googlegroups.com
How to destroy Sliderkit and create one again?

When I change quantity of photos dynamically in Sliderkit carousel (so I change DOM structure), 
I have to destroy old "object" and create new again. 
That is why, after DOM changing Sliderkit doesn't understand that it has another DOM structure and has another quantity of photos inside.

Step#1:  Start page. Sliderkit works perfectly.

       $( ".my-photogallery").sliderkit({     //...//    });

Step#2:  Change photos inside "my-photogallery".

Step#3:  Re-define handler again.

       $( ".my-photogallery").sliderkit({     //...//    });

Step#4:  Sliderkit doesn't work properly.

Mr.Torrent

unread,
Jul 19, 2012, 7:43:38 PM7/19/12
to slid...@googlegroups.com
I have found solution already. Thanks to Alex Frog.

Over here i put simple example of code which rebuild Sliderkit.
I hope it doesn't have bad mistakes and will work perfectly in any cases.
Right now it works perfectly.

<script>

var PA = {}; // usefull array

$(window).load(function(){
$(".my-gallery").sliderkit({
mousewheel:false,
shownavitems:5,
panelbtnshover:false,
auto:false,
circular:false,
navscrollatend:false,
navpanelautoswitch:false,
counter:true,
debug:1
});
PA.mySliderkit = $( ".my-gallery" ).data("sliderkit");
});//WINDOW LOAD




$(document).ready(function(){

    $('#button_load_new_photos').live('click', function(e){

// ...
// Load new photos in DOM. Here works AJAX.
// ...
// Re-initialize Sliderkit.
var options = PA.mySliderkit.options;
PA.mySliderkit._init( ".my-gallery", options );
    });

});//DOCUMENT READY

</script>


Documentation:

aqui...@gmail.com

unread,
Feb 4, 2013, 5:35:53 PM2/4/13
to slid...@googlegroups.com
Hello all!
I spended a lot of time for the same problem and I solved it!
Solution, described here, is not a solution really. After reinitializing plugin with other items collection plugin will work unstable. You will see blinking slider items on autoscroll by timer, etc... and as more bugs you will see as much times you will modify your source items collection.
And now I will describe, why. The reason are EVENTS!!! They are accumulating on dom-elements (in your case it is $( ".my-photogallery")). If you will debug you will see it! Just add in debugger this watch expression: $( ".my-photogallery").data('events') and you can monitor how events will accumulate after each time you will reinitialize this plugin on your newly modified collection.
So, the solution is very simple, you already guess, I mean:
$( ".my-photogallery").unbind(); //YEAH! This is the fix!
$( ".my-photogallery").sliderkit({     //...//    }); //and after calling unbind() you can reinitialize correctly
This is the bug of this plugin, I mean. Needs to write for support. I didn't. I better post here - this will more useful imho.
So, author forgot call $(this).unbind() at the beginning of private _init() method (see sources).
Good Luck!

Aquirier, Russia, S-Pb web developer, Quantum Art.
Reply all
Reply to author
Forward
0 new messages