jquery幻燈片頁面底部

我有一個問題有關jQuery。我有一個評論框，當點擊一個按鈕時，使用jQuery進行切換。jquery幻燈片頁面底部

我遇到的問題是，該按鈕位於頁面頂部，表單位於最下方，因此如果有人單擊該按鈕，他們將看不到該評論框已被切換。有沒有什麼辦法，一旦他們點擊提交評論按鈕，頁面會自動拖到底部，以便他們可以看到表單？

2011-08-30 Shanon

您可以將ID添加（例如yourformid）的形式和做重定向，如：HTTP：// yoururl＃yourformid。在這個頁面會向下移動到表格

2011-08-30 19:04:14 Samich

簡單地使用錨狀：

<a href="#formone" onclick="showform()">Form</a> 
<form id="formone">....</form>

來源

2011-08-30 19:04:31

您可以動畫的方式有滾動這樣的：

$('#buttonID').click(function(){ 
    $('html, body').animate({ 
    scrollTop: $('#elementID').offset().top 
    }); 
});

只需用ID代替#elementID您要滾動到底部的元素。

確保包裝你的代碼準備好處理：

$(function(){ 
    $('#buttonID').click(function(){ 
     $('html, body').animate({ 
     scrollTop: $('#elementID').offset().top 
     }); 
    }); 
});

來源

2011-08-30 19:04:50 Sarfraz

謝謝sarfraz你讓我的一天夥計，並可以你解釋它是如何工作的真的因爲我不是一個jquery怪胎 – Shanon

@Shanon：jQuery的'animate'功能非常靈活，你可以用它來創建自己的自定義動畫。這裏我們指定要滾動到的元素的頂部位置。 'animate'功能可以幫助您以動畫方式在那裏滾動。 – Sarfraz

謝謝sarfraz！ – Shanon

一個簡單的解決辦法是改變你的button元素a元素，因爲button特別是對於表單提交的HTML和a元素可以用來文檔內導航。

所以當你有一個a元素，放置一個ID屬性您的評論框，如：

<div id="commentBox"></div>

然後把以前a元素的HREF屬性值應爲#commentBox因此該元素可能如下所示：

<a href="#commentBox" onclick="$('#commentBox').show();">Text</a>

此解決方案利用瀏覽器的功能導航t評論框，因此它可能是最標準的方式，雖然它不能實現滾動的動畫。

來源

2011-08-30 19:07:12 otakustay

您可以使用錨，然後動畫滾動，很像Sarfaz的答案：

function goToByScroll(id){ 
     $('html,body').animate({scrollTop: $("#"+id).offset().top},'slow'); 
}

然後，你可以這樣調用它：

<script> 
    goToByScroll("theIdIWantToGoTo"); 
</script>

演示：http://djpate.com/portfolio/scrollTop/

來源：http://djpate.com/2009/10/07/animated-scroll-to-anchorid-function-with-jquery/

來源

2011-08-30 19:08:13

jquery幻燈片頁面底部

回答

相關問題