Javascript - fadein effect Uncaught SyntaxError: m

2019-08-17 09:13发布

问题:

I'm loading a front-end site onto Wordpress and a javascript file that was working fine before has been edited to avoid any conflicts using $ for jQuery functions. Now I'm getting the error above in the console and can't seem to rectify. I've been having issues with making this effect work on Safari as documented here .

Here's my code in the javascript file -

fadein.js

$.noConflict();

jQuery(document).ready(function($) {
  var win = $(window),
    doc = $(document),
    tags = $("section");

  win.on("scroll", function() {
      tags.each(function(i, tag) {
        if ($(tag).position().top < (doc.scrollTop() + win.outerHeight())) {
          $(tag).addClass("visible");
        } else {
          $(tag).removeClass("visible");
        }
      });
    }
  });
});

And the css for the section opacity -

style.css

/* Fade in/out */


section {
  opacity: 0;
  -webkit-transform: translate(0, 10px); 
  -webkit-transition: all 1s;
  transform: translate(0, 10px); 
  transition: all 1s;
}

section.visible { 
  opacity: 1;
  -webkit-transform: translate(0, 0); 
  transform: translate(0, 0); 
}


/*  ---------------------- */

I'm unable to tell if the edited code works on Safari as yet because of this error. It was working fine on Chrome and Firefox. Any help appreciated.

UPDATE -

Console error reading -

回答1:

Just replace the 4 last lines of your js file from :

    });
    }
  });
});

by

    });
  });
});


回答2:

Here you go with correct syntax

$.noConflict();

jQuery(document).ready(function($) {
  var win = $(window),
    doc = $(document),
    tags = $("section");

  win.on("scroll", function() {
    tags.each(function(i, tag) {
      if ($(tag).position().top < (doc.scrollTop() + win.outerHeight())) {
        $(tag).addClass("visible");
      } else {
        $(tag).removeClass("visible");
      }
    });
  });
});

Hope this will help you.