Parallax scroll with the newest jQuery isn't working

Question

I used a jQuery script for a parallax effect. The script works fine with older versions of jQuery (till version 1.11.3) but when I replaced it with the newest version the smooth scrolling effect didn't work. Does anyone now what part of the code isn't anymore supported?

$(document).ready(function() { 
  $('a[href*=#]').each(function() {  
    if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '')   && location.hostname == this.hostname   && this.hash.replace(/#/, '')) {   
      var $targetId = $(this.hash),
        $targetAnchor = $('[name=' + this.hash.slice(1) + ']');   
      var $target = $targetId.length ? $targetId : $targetAnchor.length ? $targetAnchor : false;    
      if ($target) {     
        var targetOffset = $target.offset().top;

             
        $(this).click(function() {
          $("#nav li a").removeClass("active");
          $(this).addClass("active");      
          $('html, body').animate({
            scrollTop: targetOffset
          }, 1000);      
          return false;     
        });   
      }  
    } 
  });
});

Check the console to see what the exact error is. Then you can debug it — Rory McCrossan
– Rory McCrossan, Commented Sep 29, 2018 at 13:23

tao · Accepted Answer · 2018-09-29 13:34:09Z

1

It's the selector.

Replace $('a[href*=#]') with $('a[href*="#"]').

It was never a valid selector to begin with.
When they fixed it, all scripts using the flawed (but working up to then) syntax broke.

Caused quite a bit of unrest at the time, especially since a lot of "pro" WordPress themes were using it and broke over night. It was fun to watch people's reaction when they realized the product they bought was failing at what they considered to be basic functionality.

See this issue: https://github.com/jquery/jquery/issues/2824

edited Sep 29, 2018 at 13:34

answered Sep 29, 2018 at 13:24

tao

91.1k18 gold badges136 silver badges174 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Crypted_39 Over a year ago

Thank you. I looked at the console and it was the selector. \\# worked too.

Collectives™ on Stack Overflow

Parallax scroll with the newest jQuery isn't working

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related