鏈接時防止滾動重置？

我正在製作一個網頁，其中包含幾個相同的html頁面，除了它們包含不同的圖像，這些圖像的大小几乎相同 - 以及它們是如何命名的，通過它們的jpg功能。

圖片看起來很棒，但我有一個300像素的標題，將它們向下推動>迫使你向下滾動以查看完整圖像。這是所有這些圖庫頁面的共享CSS內置的。

我在圖片下面有簡單的文字鏈接，它們被硬編碼爲指向圖庫中的下一張圖片。（我有一個列表顯示20個圖像）。當有人點擊圖像時，它會轉到該頁面並將滾動重置到頂部，這會使標題將圖像區域向下推。

誰能告訴我如何防止新鏈接的滾動重置行爲？

2012-02-02 user1152532

沒有使用像jQuery的，你可以鏈接的網頁，這樣你有一個錨標記像<a name="gallery"></a>每一頁上的圖像之上，並給予鏈接到不同的頁面時，追加#gallery到網址如<a href="next_image.html#gallery">Next Image</a>。然而，這在每個頁面上都是重複的，並且不會產生健壯的網頁。你會想在未來改變事情，這會導致問題和進一步的工作，所以我會考慮一個動態的選擇。

請注意，這看起來不像jQuery那樣無縫，並且在需要時使用AJAX加載圖像。或者更好的是，由於大多數JS畫廊的工作，首先加載圖像到頁面不可見，然後與JS讓他們出現在鏈接點擊。這樣做的好處是你可以使用提供的圖像在JS中生成鏈接。如果圖片足夠大，導致頁面加載時可能造成相當大的延遲，請考慮製作某種類型的佔位符圖片。無論如何，請看lightbox 2。

此外，我沒有感受到您使用任何服務器端腳本創建此庫。如果js解決方案不適合您，或者您根據當時的內容需求自動生成部分網站的附加好處，請查看使用諸如PHP，Python，Ruby等的內容。如果它只是一個簡單的網站，一個很好的解決方案可能是Wordpress。

來源

2012-02-02 04:56:15

是的，我添加了一個錨，並停止滾動。非常穩固，謝謝。我正在顯示400kb的圖像，所以根據我的需要，加載時間並不是太多。最終，當我能夠掌握服務器端腳本時，我會創建一個更高效的網站庫。在這一點上，我正在尋找一磚一瓦建造東西，但本土的。我有一個平面設計背景，所以我可以通過圖形來掩飾其簡單性。 – user1152532 2012-02-02 23:34:19

很高興聽到它的作品:) – 2012-02-03 03:03:23

你可以有一個頁面，只需更換圖像？ http://www.quirksmode.org/dom/fir.html

當然，如果您有某種類型的照片庫，您當然可以更改「上一個/下一個」按鈕系統的功能。

請發佈更多信息。

來源

2012-02-02 04:51:29 ionFish

感謝您的信息。 – user1152532 2012-02-02 23:35:27

你希望你的鏈接看起來像這樣：

<a href="http://www.w3schools.com/html_links.htm#tips"> 
Visit the Useful Tips Section</a>

，你想給你的圖像的ID在這種情況下=「祕訣」。

看看這個小提琴看到一個例子。唯一的區別是你的href會像上面發佈的代碼一樣在那裏存放網址的其餘部分。

http://jsfiddle.net/QgzsL/

來源

2012-02-02 04:52:33 Jason

感謝您的回答。 – user1152532 2012-02-02 23:28:47

鏈接時防止滾動重置？

回答

相關問題