[英]Scrolling works in Chrome but not in Firefox or IE
當用戶單擊一些不同的鏈接時,我使用以下代碼滾動窗口:
$(document).ready(function(){
$("#footerlink").click(function(){
$("#slide1").slideto({});
});
$("#logo").click(function(){
$("#slide1").slideto({});
});
$("#home").click(function(){
$("#slide1").slideto({});
})
$("#others").click(function(){
$("#slide2").slideto({});
})
$("#me").click(function(){
$("#slide3").slideto({});
});
$("#laughs").click(function(){
$("#slide4").slideto({});
});
})
幻燈片功能來自以下腳本:
(function(b) {
b.fn.slideto = function(a) {
a = b.extend({
slide_duration: 1000,
highlight_duration: 3E3,
highlight: false,
highlight_color: "#FFFF99"
}, a);
return this.each(function() {
obj = b(this);
b("body").animate({
scrollTop: obj.offset().top
}, a.slide_duration, function() {
a.highlight && b.ui.version && obj.effect("highlight", {
color: a.highlight_color
}, a.highlight_duration)
})
})
}
})(jQuery);
我的問題是滾動僅適用於Chrome,不適用於Firefox或IE。 FF和IE的降級效果很好,因此鏈接仍然有效,但是我真的很喜歡滾動動畫。
僅供參考:我通過以下兩行呼叫Jquery:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
這是我的代碼的小提琴: http : //jsfiddle.net/LwXR3/
您能幫我找出問題嗎?
好的,這太久了,無法發表評論。 您應該真正避免上面代碼中的復制粘貼混亂。 代碼幾乎完全相同,但減去ID。 使用href獲取位置,而不是對其進行硬編碼。
的HTML
<a class="slideLinks" href="#foo">go to foo</a>
的JavaScript
$(".slideLinks").on("click", function(e){
e.preventDefault(); //p[revent the click
$(this.hash).slideto({}); //call your slide to function with the hash value for the id
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.