作爲後續問題:Most efficient way to do a horizontal sliding layout,是否有可能使瀏覽器的後退和前進按鈕在使用單一頁面佈局時有效?如何使瀏覽器在單頁面佈局上前後移動?
4
A
回答
5
您可以使用HTML5中的歷史記錄API來實現該功能。
這裏有一些資源,讓你開始:
- http://diveintohtml5.info/history.html
- http://html5demos.com/history
- https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history
要獲得舊版瀏覽器的支持,以及有JavaScript庫,使即:
先進例如通過Chrome團隊,使用歷史API:
2
是的,你可以使用HTML5歷史API來實現它。
0
在舊的方式,你可以嘗試使用書籤,例如
<html>
<head>
<script type="text/javascript">
function goPage (v) {
var idisplay = v == 'i',
adisplay = v == 'a',
bdisplay = v == 'b';
document.getElementById('anchor_i').style.display = idisplay? 'none' : 'block';
document.getElementById('anchor_a').style.display = adisplay? 'none' : 'block';
document.getElementById('anchor_b').style.display = bdisplay? 'none' : 'block';
document.getElementById('content_i').style.display = idisplay? 'block' : 'none';
document.getElementById('content_a').style.display = adisplay? 'block' : 'none';
document.getElementById('content_b').style.display = bdisplay? 'block' : 'none';
}
</script>
</head>
<body>
<a name="index"></a>
<div id="content_i">
index
</div>
<a id="anchor_i" href="#index" onclick="goPage('i');" style="display: none">to index</a>
<a id="anchor_a" href="#page_a" onclick="goPage('a');">to page_a</a>
<a id="anchor_b" href="#page_b" onclick="goPage('b');">to page_b</a>
<a name="page_a"></a>
<div id="content_a" style="display: none">
page a
</div>
<a name="page_b"></a>
<div id="content_b" style="display: none;">
page b
</div>
</body>
</html>
相關問題
- 1. 爲什麼chartjs在移動瀏覽器上滯後頁面?
- 2. 瀏覽器縮小頁面佈局
- 3. 使用urllib發佈表單並移動到網頁瀏覽器
- 4. 基於移動和桌面瀏覽器切換佈局
- 5. 使用Google Chrome瀏覽器檢測器更改頁面佈局
- 6. 單頁面佈局每頁全頁面瀏覽器窗口大小
- 7. 瀏覽器向前/向後滑動頁面效果,如github
- 8. 如何防止移動瀏覽器上的縮放和移動頁面?
- 9. 網頁瀏覽器中的移動「推送」頁面 - 如何?
- 10. 在移動瀏覽器中左右移動頁面
- 11. 移動網頁瀏覽器上的HTML5
- 12. 如何在瀏覽器中直接瀏覽先前瀏覽過的頁面?
- 13. 如何查看移動網頁瀏覽器在移動設備上運行的前臺或後臺
- 14. 移動Safari瀏覽器在新頁面上閃爍
- 15. 在Android瀏覽器的畫布上繪製,頁面滾動?
- 16. 如何使用jQuery在移動瀏覽器上動畫滾動?
- 17. 如何在移動網頁瀏覽器上播放flv視頻?
- 18. 如何在桌面瀏覽器上運行移動joomla?
- 19. 使用圖像瀏覽平移佈局
- 20. 用於瀏覽器內頁面佈局編輯器的Backbone.js?
- 21. 如何在頁面佈局中移動頁腳
- 22. jQuery移動頁面超大Safari瀏覽器移動
- 23. 移動瀏覽器上的Javascript/jQuery頁面更改事件
- 24. 在後臺加載瀏覽器頁面
- 25. 當佈局在上面縮小時,向上移動佈局
- 26. 使用瀏覽器/頁面滾動條
- 27. 如何模擬桌面上的移動(安卓)瀏覽器
- 28. Magento - 如何在主頁上使用5列布局,然後在類別頁面上使用4列布局?
- 29. 當在不同的瀏覽器上渲染頁面佈局變化
- 30. 如何使用selenium-webdriver在瀏覽器上刷新頁面?
第二個鏈接不工作,它有? –
@jepser修復了鏈接 –