使用箭頭鍵逐步通過水平滾動網站上的錨點

我有一組圖像的頁面，每個圖像都包含在white-space:nowrap div中的唯一ID（「Main-1」，「Main-2」等）該頁面水平滾動。我想通過使用左右箭頭鍵（最好使用滾動動畫，在當前現有的直接導航鏈接中使用scrollTo()）來循環瀏覽這些圖像。我發現這個垂直滾動的網站，但似乎無法找到一個水平等效（和我的JS不是很好，所以我試圖將垂直代碼轉換爲我的水平滾動頁面已慘敗！）。使用箭頭鍵逐步通過水平滾動網站上的錨點

這JFiddle正是我想要的，但對於垂直滾動網站：http://jsfiddle.net/aVvQF/4/ .....任何人都可以幫助我轉換這與水平滾動使用？

謝謝！

來源

2013-07-31 user2634764

由於您的代碼已經正常工作，所以很容易適應。

退房this JSFiddle在水平方向，而不是垂直

$('html, body').clearQueue().animate({scrollTop: $targetElement.offset().top }, 1000);

的工作原理是通過

$('html, body, #placeholder').clearQueue().animate({scrollLeft: $targetElement.offset().left }, 1000);

更換正如你看到的，我也調整了佔位符DIV，並增加了id選擇。

注意，這僅與向上和向下箭頭鍵的作品，我不想做所有的工作:)

來源

2013-08-02 11:24:49 NDM

謝謝 - 我已經意識到有，雖然這使得這個特別複雜的一個額外的問題，因爲我想繼續讓平滑滾動。所以我實際上需要找到一些可以檢測瀏覽器窗口在哪裏以及它應該滾動到哪裏的Javascript ... Eeek！ – user2634764

使用箭頭鍵逐步通過水平滾動網站上的錨點

回答

相關問題