jQuery滾動到下一個/上一個Div

-2

我是jQuery新手;忍受着我。一直試圖通過pdoherty926使用這個簡單（但大）的解決方案，下一代以前滾動：jQuery滾動到下一個/上一個Div

jQuery Scroll to Next Div Class with Next/Previous Button

但是，從他的jsfiddle複製鏈接代碼之後滾動不會在我的網頁上工作。我錯過了什麼？

我已經把它全部成HTML5頁面發揮它（顯然將移動樣式和JS分離聯CSS和JS文件）：

<!DOCTYPE HTML> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>scroll test</title> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
$('div.section').first(); 
$('a.display').on('click', function(e) { 
e.preventDefault(); 
var t = $(this).text(), 
that = $(this); 
if (t === 'next' && $('.current').next('div.section').length > 0) { 
var $next = $('.current').next('.section'); 
var top = $next.offset().top; 
$('.current').removeClass('current'); 
$('body').animate({ 
scrollTop: top  
}, function() { 
$next.addClass('current'); 
}); 
} else if (t === 'prev' && $('.current').prev('div.section').length > 0) { 
var $prev = $('.current').prev('.section'); 
var top = $prev.offset().top; 
$('.current').removeClass('current'); 
$('body').animate({ 
scrollTop: top  
}, function() { 
$prev.addClass('current'); 
}); 
} 
}); 
}); 
</script> 
<style type="text/css"> 
.section {background-color:gray; height:440px; margin-bottom:20px;} 
.navigation {position:fixed; right:50px; top:10px;} 
</style> 
</head> 
<body> 
<div class="main"> 
<div class="navigation"> 
<a href="#" class="display">next</a><br> 
<a href="#" class="display">prev</a> 
</div> 
<div id="one" class="section current"> 
One 
</div> 
<div id="two" class="section"> 
Two 
</div> 
<div id="three" class="section"> 
Three 
</div> 
<div id="four" class="section"> 
Four 
</div> 
</div>

任何和所有幫助/建議非常歡迎。

來源

2015-02-06 Andrew Hills

請將jsfiddle添加到您的代碼不起作用。 – colti 2015-02-06 16:08:29

你有什麼錯誤？ – j08691 2015-02-06 16:08:34

我們需要更多信息，你可以發佈你的代碼，有沒有任何錯誤信息？S – atmd 2015-02-06 16:08:42

我上的jsfiddle 你的腳本，你只需要使用jQuery的1.8.3代替1.9.1。因此改變你的jQuery 庫與版本1.8.3

請插入下面的jQuery庫

<script src="https://code.jquery.com/jquery-1.8.3.min.js"></script>

來源

2015-02-06 16:32:32 user3078111

的HTML，CSS和JS的功能，你可能會使用過時的jQuery庫。看到工作jsfiddle：http://jsfiddle.net/swm53ran/200/

你需要使用jQuery版本1.11或更高版本。版本2+是更preferrable（但有時它不與IE < 9很好地工作，而1.11是穩定的IE < 9）

<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>

來源

2015-02-06 16:43:06 indubitablee

請更改jQuery庫腳本，而不是按照

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

更新如下：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

其實你不寫HTTP：協議，它是N從googleapis

來源

2015-02-06 16:45:14 user3078111

jQuery滾動到下一個/上一個Div

回答

相關問題