我有2个图像在我的HTML。 1我在移动版本上展示(如果屏幕小于992px),另一个在桌面版本上展示。jQuery滚动到锚点在手机上工作,但不在桌面上
我向这些图像添加了一个ID用作锚点。一切工作在移动设备上很好,但在桌面版本上,它不想去锚点。即使id在html中。
这是我在HTML图像的样子:
<img id="wie" class="cool-image-2" src="source1" alt="">
<img id="wie" class="cool-image-2" src="source2" alt="">
这些链接: Dekstop菜单:
<ul class="nav navbar-nav">
<li class="navbar-right"><a data-id="wie" href="#wie">Wie</a></li>
</ul>
手机菜单:
<ul class="nav mobile-nav-bar">
<li class="navbar-right"><a data-id="cont" href="#contact">Contact</a></li>
</ul>
这是我的jQuery:
jQuery(".nav li a").click(function(e) {
e.preventDefault();
$id = jQuery(this).attr("data-id");
jQuery("a.clicked").removeClass("clicked");
jQuery(this).addClass("clicked");
console.log($id);
jQuery('html, body').animate({
scrollTop: jQuery("#"+$id).offset().top
}, 1000);
});
任何人都知道为什么它不能在桌面上工作?
很多预先感谢!
您需要为每个图像都有唯一的'id'。 正确的代码应该是: ' ' – Aziz