javascript - 无法点击链接

Question

我正在使用 Bootstrap 模板。 ( http://brybell.me/br1 ) 底部导航栏中的链接无法正常工作。浏览器识别为链接，可以右键在新页面打开，但是不能直接点击。我不确定问题出在哪里，但我的 friend 提到了 z-index？

这是导航 html。

<nav class="main nav-collapse visible-desktop">

                <ul class="inline">
                    <!-- <li><a href=".home">Home</a></li> -->
                    <li><a href="http://www.google.com"><img src="images/appstore_button.png" alt="Get the iPhone App Now!" /></a></li>
                    <li><a href="#"><img src="images/googleplay_button.png" alt="Get the Android App Now!" /></a></li>
                    <li><a class="linkage" href=".our-team">Terms of Service</a></li>
                    <li><a class="linkage" href=".privacy">Privacy Policy</a></li>
                    <li><a class="linkage" href="mailto:breathless@breathless.com">Contact</a></li>

                </ul>

            </nav> <!-- /nav.main -->

这是 CSS。

header.main.fixed {
position:fixed;
background:#44606e;
top:0;
width:100%;
left:0;
height:80px;
margin-top:0;
z-index:1000000;
}

header.main {
position:relative;
z-index:10000;
height:80px;
margin-top:-80px;
background:rgba(0,0,0,0.5);
}

header.main > .container {
position:absolute;
z-index:1000;
left:50%;
margin-left:-470px;
}

a.logo {
float:left;
position:relative;
top:10px;
}


nav.main {
float:right;
}

nav.main ul {
margin:0;
}

nav.main ul li {
margin:0;
}

nav.main ul li a img {
color:#FFF;
display:block;
text-shadow:1px 1px 2px rgba(0,0,0,0.25);
padding:10px;
line-height:20px;
}

nav.main ul li a.linkage {
color:#FFF;
display:block;
text-shadow:1px 1px 2px rgba(0,0,0,0.25);
padding:30px 10px;
line-height:20px;
}

header.fixed nav.main ul li a.active {
background:rgba(0,0,0,0.2);
}

header.main .mobile-nav {
margin-top:25px;
}

我对 z-index 相当陌生，所以这让我很困惑。我现在明白它一定与 header.main.fixed 中的 100000 z 索引有关。

非常感谢任何帮助! :]

还有一些人认为可能导致问题的 JS:

$('nav.main a').click(function(e) {
    e.preventDefault();
    $target = $(this).attr('href');
    $padding = $($target).css('padding-top');
    $padding = $padding.substring(0, $padding.length - 2);
    $padding = parseInt($padding);
    $position = $($target).offset().top - $padding;
    $('html, body').animate({
        scrollTop: $position
    }, 1000, 'easeInQuart');
});

Answer 1

页面上存在 javascript 错误。

(Checked with firebug)

custom.js (row 160) TypeError: $padding is undefined

错误代码:

$padding = $padding.substring(0, $padding.length - 2);