Rails 4 breaks Stellar.js after link

Question

My rails 4 app breaks stellar.js after link_to.

I know that is something related with turbolinks. I installed jquery.turbolinks and my js functions from uikit are all working now. But the stellar.js still don't..

It works when I type the address in browser: 0.0.0.0:3000, but do not after clicking any link.

I am calling stellar.js from my assets/javascripts/my-js.js like this:

$(function(){
    $.stellar();
});

I also tried with no success:

function initialize() {
    $.stellar();
}

$(document).ready(initialize);
$(document).on('page:load', initialize);

Thank you

Answer 1

Your issue is most certainly related to Turbolinks. I have a feeling that when you call $.stellar() after a Turbolink request, the call has no effect since it's already attached to the window object and that doesn't go away during a the request. Try destroying it prior to initializing it again in the initialize function.

var initialize = function() {
    $.stellar( 'destroy' );
    $.stellar();
}

$(document).ready( initialize );
$(document).on( 'page:load', initialize );

Answer 2

You can also bind the destroy method to the turbolink before-cache event :

$(document).on "turbolinks:before-cache", ->
  $.stellar('destroy')