Javascript Jquery使用ID值平滑滚动到在skrollr.js中不起作用的部分
我正在使用skrollr.js。。。 我希望我的网站滚动到 roy coy.in/index.php#scene-01 如果我没有错的话 这个url应该将我带到id为=“scene-01”的元素……但它不是。 相反，它把我带到了主页 i、 e.到顶端 以下是html代码：Javascript Jquery使用ID值平滑滚动到在skrollr.js中不起作用的部分,javascript,jquery,html,skrollr,Javascript,Jquery,Html,Skrollr,我正在使用skrollr.js。。。 我希望我的网站滚动到 roy coy.in/index.php#scene-01 如果我没有错的话 这个url应该将我带到id为=“scene-01”的元素……但它不是。 相反，它把我带到了主页 i、 e.到顶端 以下是html代码： 元件已定位固定。浏览器无法知道您希望它跳转到哪里，因为固定元素不会移动（除非您设置它们的动画）。@Prinzhorn那么我应该将位置设置为相对位置还是绝对位置，或者。。。。请帮帮我。。。因为我想把导航菜单添加到我的网站上…
元件已定位固定。浏览器无法知道您希望它跳转到哪里，因为固定元素不会移动（除非您设置它们的动画）。@Prinzhorn那么我应该将位置设置为相对位置还是绝对位置，或者。。。。请帮帮我。。。因为我想把导航菜单添加到我的网站上…你不能使用原始意义上的哈希跳跃。您需要提供以像素为单位的绝对偏移，以便浏览器知道跳转的位置。例如，与数据菜单顶部一起使用
<link rel="stylesheet" href="css/normalize.css">
<script type="text/javascript" src="scripts/skrollr.min.js"></script>
<link href='css/ie.css' rel="stylesheet">
<link rel="stylesheet" href="css/style.css" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="css/jquery.bxslider.css" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Raleway:400,300,600,900' rel='stylesheet' type='text/css'>
<script src="scripts/jquery-1.8.2.min.js"></script>
</head>
<body>
<section>
<article id="home" data-0="top:0%" data-1000="top:-100%" >
</article>
<article id="scene-01" class="left" data-0="top:0%" data-2500="top:0%" data-3000="top:-100%">
</article>
<article id="scene-03" class="left" data-0="top:0%;">
</article>
<article id="scene-04" class="left" data-0="left:100%;" data-6500="left:100%" data-7000="left:0%;" data-7500="height:0%;top:50%;border-width:1px;" data-8300="border-width:0px;height:100%;top:0%;">
</article>
<article id="scene-05" class="left" data-0="left:-100%;" data-9800="left:-100%" data-12000="left:0%;" data-22200="background-color:rgb(0,153,204)" data-22800="background-color:rgb(217,36,5))">
</article>
<article id="scene-06" class="left" data-0="top:100%;" data-12200="top:100%" data-12700="top:-60%;">
</article>
<article id="scene-07" class="left" data-0="transform[sqrt]:rotate(0deg);-ms-transform[sqrt]:rotate(0deg);opacity:0;" data-18700="transform[sqrt]:rotate(0deg);-ms-transform[sqrt]:rotate(0deg);opacity:0;" data-20100="transform[sqrt]:rotate(315deg);opacity:1;-ms-transform[sqrt]:rotate(315deg);" data-22200="left:50%" data-22800="left:100%">
</article>
<article id="scene-075" data-0="display:none" data-18700="display:block;left:50%" data-19200="left:0%;display:block" data-21601="display:none;">
</article>
<!-- color slides -->
<article id="slide-01" data-0="left:50%; display:none" data-20500="left[swing]:50%; display:block" data-21000="left[swing]:40%;" data-21600="left[bounce]:50%;display:block" data-21601="display:none;">
</article>
<article id="slide-02" data-0="left:50%; display:none" data-20500="left[swing]:50%; display:block" data-21000="left[swing]:30%;" data-21600="left[bounce]:50%;display:block" data-21601="display:none;">
</article>
<article id="slide-03" data-0="left:50%; display:none" data-20500="left[swing]:50%; display:block" data-21000="left[swing]:20%;" data-21600="left[bounce]:50%;display:block" data-21601="display:none;">
</article>
<article id="slide-04" data-0="left:50%; display:none" data-20500="left[swing]:50%; display:block" data-21000="left[swing]:10%;" data-21600="left[bounce]:50%;display:block" data-21601="display:none;">
</article>
<article id="slide-05" data-0="left:50%; display:none" data-20500="left[swing]:50%; display:block" data-21000="left[swing]:0%;" data-21600="left[bounce]:50%;display:block" data-21601="display:none;">
</article>
<article id="slide-06" data-0="left:50%; display:none" data-20500="left[swing]:50%; display:block" data-21000="left[swing]:-10%;" data-21600="left[bounce]:50%;display:block" data-21601="display:none;">
</article>
<article id="slide-07" data-0="left:50%; display:none" data-20500="left[swing]:50%; display:block" data-21000="left[swing]:-20%;" data-21600="left[bounce]:50%;display:block" data-21601="display:none;">
</article>
<!-- end color slides -->
<article id="scene-08" data-0="display:none" data-20000="display:block;left:50%" data-20400="left:0%" data-22200="left:0%" data-22800="left:100%">
</article>
<article id="share" data-0="display:none" data-22700="display:block;height[bounce]:0px" data-23000="height[bounce]:100px">
</article>
<div class="clr"></div>
</section>
<footer>
</footer>
<script type="text/javascript">
var s = skrollr.init();
</script>
<script src="scripts/scripts.js"></script>
<script src="scripts/jquery.appear.min.js"></script>
<script src="scripts/jquery.timeago.js"></script>
<script src="scripts/jquery.flexisel.js"></script>
<script src="scripts/jquery.currentMenuItem.js"></script>
<script src="scripts/jquery.localscroll-1.2.7-min.js"></script>
<script src="scripts/jquery.fitvids.js"></script>
<script src="scripts/jquery.isotope.min.js"></script>
<script src="scripts/jquery.responsiveslides.min.js"></script>
<script src="scripts/jquery.sticky.js"></script>
<script src="scripts/jquery.bxslider.min.js"></script>
<script src="scripts/jquery.parallax-1.1.3.js"></script>
</body>
</html>