JavaScript在Chrome中不能在Firefox中使用

Question

I have a navbar that works in Chrome(41.0.2272.89) but not in Firefox(36.0.1).

HTML

    <div class="collapse navbar-collapse" id="navbar">
      <ul class="nav navbar-nav">
        <li  class="active"><a class="navBtn" onclick="scrollTo(home)" title="#home">Home</a></li>
        <li><a class="navBtn" onclick="scrollTo(about)" title="#about">About</a></li>
        <li><a class="navBtn" onclick="scrollTo(clients)" title="#clients">Clients</a></li>
        <li><a class="navBtn" onclick="scrollTo(portfolio)" title="#portfolio">Portfolio</a></li>
        <li><a class="navBtn" onclick="scrollTo(contact)" title="#contact">Contact</a></li>
      </ul>
    </div><!-- /.navbar-collapse -->

Using a simple onclick, it will activate my JS

JS

function scrollTo(element) {
if(element == document.getElementById('home')) {
    $('html, body').animate({
        scrollTop: $(element).offset().top - 54
    }, 500);
} else {
    $('html, body').animate({
        scrollTop: $(element).offset().top - 53 
    }, 500);
}}

It seem the JS activates in Chrome but not in Firefox.

What is supposed to happen is that when you click a item, the site will scroll down to it. This used to work fine, but now it suddenly now longer works.

Example HERE

Answer 1

scrollTo must be a reserved word due to their own Window.scrollTo() function.

function moveTo(element) {
if(element == document.getElementById("home")) {
    $("html, body").animate({
        scrollTop: $(element).offset().top - 54
    }, 500);
} else {
    $("html, body").animate({
        scrollTop: $(element).offset().top - 53 
    }, 500);
}}

So changing the function name returned normal functionality.

Answer 2

Seems to me your onclick definitions are faulty.

Instead of:

<li><a class="navBtn" onclick="scrollTo(about)" title="#about">About</a></li>

Try using single quotes around the DIV names like:

<li><a class="navBtn" onclick="scrollTo('about')" title="#about">About</a></li>

This will also require some adjustments to the function code as well to handle passing the name of the DIV instead of the object.