アニメーションのスクロールに問題があるので、私はあなたに書いています。どのように私はそれを修正することができます考えを誰も持っていますか? 現在、私は特定のセクションにジャンプしますが、ゆっくりと下がることはありません。divにスクロールする(スロースクロールアニメーション)JQuery
HTMLコード:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title></title>
<link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />
<script type="text/javascript" src="js/custom.js"></script>
<script src="js/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<div id="sidebar">
<ul class="nav navbar-nav">
<li class="active"><a href="#section1">O Firmie <span class="sr-only">(current)</span></a></li>
<li><a href="#section2">Flota</a></li>
<li><a href="#section3">Oferta</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#section4">Kontakt:</a></li>
</ul>
</div>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<div class="slider" id="section1">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae elit non ipsum volutpat commodo nec eget odio. Vestibulum ut enim leo. Mauris
<br /><br /><br />
</div>
<div class="o_firmie" id="section2">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae elit non ipsum volutpat commodo nec eget odio. Vestibulum ut enim leo. ac enim sit amet viverra.<br /><br /><br />
</div>
<div class="mapa" id="section3">
finibus. Integer malesuada, ante vitae auctor accumsan, quam eros maximus risus, vitae sollicitudin justo magna porttitor augue. Quisque facilisis ac enim sit amet viverra.<br /><br /><br />
</div>
<div class="flota" id="section4">
facilisis ac faucibus purus. Praesent eleifend nisi nulla, vitae imperdiet nulla rhoncus quis. Nunc vel lacus sapien. Curabitur euismod augue et sem malesuada finibus. Integer malesuada, ante vitae auctor accumsan, quam eros maximus risus, vitae sollicitudin justo magna porttitor augue. Quisque facilisis ac enim sit amet viverra.<br /><br /><br />
</div>
<div class="footer" id="section5">
malesuada finibus. Integer malesuada, ante vitae auctor accumsan, quam eros maximus risus, vitae sollicitudin justo magna porttitor augue. Quisque facilisis ac enim sit amet viverra.<br /><br /><br />
</div>
JSコード:ここで
function goToByScroll(id){
// Scroll
$('html,body').animate({
scrollTop: $("#"+id).offset().top},
'slow');
}
$("#sidebar > ul > li > a").click(function(e) {
// Prevent a page reload when a link is pressed
e.preventDefault();
// Call the scroll function
goToByScroll($(this).attr("id"));
});
は私のライブデモです:
http://jsfiddle.net/VPzxG/3022/
私は素早くそれを解決することができますか?あなたの応答みんな
提供jsfiddleを試してみてください。 –