40378

jQuery ready not fired after rails link_to is clicked

im using the javascript below to make an image "fade in" triggered by a scroll event. But the .hide im using to initially hide the image only works when the page loads initially, typing localhost:3000.

Once i'm in the site if i try to click a link to go back to the main page,

<%= link_to 'Main', root_path %>

the main page loads with out the .hide working

Why does the .hide work when the page initially loads but if i click a link to the same page the .hide does not work. the rest of the Javascript works no matter what, i can scroll and the image fades in and out depending on the scroll position, but i need it to start hidden, and that only works when the page loads initially help

function isElementVisible(elementToBeChecked) { var TopView = $(window).scrollTop(); var BotView = TopView + $(window).height(); var TopElement = $(elementToBeChecked).offset().top + 100; var BotElement = TopElement + $(elementToBeChecked).height(); return ((BotElement <= BotView) && (TopElement >= TopView)); } $(document).ready(function(){ $("#ghost_logo").hide();// hide it initially }); $(window).scroll(function(){ isOnView = isElementVisible("#logoDiv"); if (isOnView) { //fade out small image once main logo is in view $('#ghost_logo').fadeOut(); } else { //fade in small image once main logo is out of view $('#ghost_logo').fadeIn(); } });

Answer1:

You are having a tipical problem with turbolinks, turbolinks make that DOM doesn't change when you navigate through a links, for this reason, the ready event from jQuery is never fired, you can solve this in three ways.

You can try something like:

document.addEventListener('page:load', function(){ $("#ghost_logo").hide(); });

or if this doesn't work either, try navigate with out turbolinks change a parameter of link:

<%= link_to 'Main', root_path ,{ :'data-no-turbolink' => "true" } %>

or if you want you can use this jQuery-turbolinks gem is a gem provided for solving this kind of issues.

For more information refer to turbolinks repository on github

Recommend

  • RSpec with devise - only the first test is logged in
  • Jquery Hover Flickering issue
  • How to change a class of a menu item in Rails
  • Android Wear DotsPageIndicator fades first time instead of always visible
  • How to display a selection based on user input using ajax and jquery
  • Debugging an ongoing .net process
  • How to fade bottom edge of a scrollable TextView?
  • Michael Hartl RoR tutorial chapter 12 exercise #2
  • How dotnet build chooses the output name
  • Java : How to tint this PNG programmatically?
  • Activation Function choice for Neural network
  • HttpListener.IsSupported is false on XP SP3
  • C# program and C++ DLL compiled for 32-bit system crash on 64-bit system
  • Authentication in Play! and RestEasy
  • Bad request using file_get_contents for PUT request in PHP
  • Yii2: Config params vs. const/define
  • Algorithm for a smudge tool?
  • R - Combining Columns to String Based on Logical Match
  • Get one-time binding to work for ng-if
  • HTML download movie download link
  • How would I use PHP exceptions to define a redirect?
  • output of program is not same as passed argument
  • Updating server-side rendering client-side
  • Running a C# exe file
  • Do create extension work in single-user mode in postgres?
  • Akka Routing: Reply's send to router ends up as dead letters
  • R: gsub and capture
  • jqPlot EnhancedLegendRenderer plugin does not toggle series for Pie charts
  • Comma separated Values
  • Matrix multiplication with MKL
  • Windows forms listbox.selecteditem displaying “System.Data.DataRowView” instead of actual value
  • How to set the response of a form post action to a iframe source?
  • Setting background image for body element in xhtml (for different monitors and resolutions)
  • unknown Exception android
  • Checking variable from a different class in C#
  • Observable and ngFor in Angular 2
  • How to Embed XSL into XML
  • UserPrincipal.Current returns apppool on IIS
  • Conditional In-Line CSS for IE and Others?
  • How to load view controller without button in storyboard?