製作滑塊滾動頁面

我的頁面上有一個絕對定位的jQuery滑塊。有了它，我希望能夠點擊並拖動滾動頁面。製作滑塊滾動頁面

您可以立即看到它在這裏：

http://djlol.dk/projects/index2.html（白色一個在底部）

當你在按鈕拖動滑塊，頁面跳轉奇怪。它滾動，但速度太快了。

我做這樣說：

$("#slider").slider({ 
    animate: true, 
    change: handleSliderChange, 
    slide: handleSliderSlide, 
    min: 0, 
    max:2900 
}); 

function handleSliderSlide(e, ui) 
{ 
    window.scroll(ui.value, 0); 
}

來源

2012-02-17 Simon Fredsted

我的頁面出現錯誤「handleSliderChange未定義」。另外，我不確定「當您在按鈕上拖動滑塊時」的含義。你能再詳細一點嗎？ – Simon 2012-02-17 08:26:47

嗨西蒙。我上傳了一個新副本。對不起，我的意思是底部而不是按鈕。拖動滑塊的手柄是爲了水平滾動頁面，但速度太快。 – 2012-02-17 10:10:49

的問題出現在固定滑塊的窗口位置和滑蓋內部確定多遠移動每個滑塊的方式進行捆綁處理。

滑塊插件會根據鼠標位置更改以及元素的左偏移量，計算每個鼠標移動事件中滑塊處理程序的新位置。滑塊元素使用css屬性position:fixed，並且在瀏覽器窗口滾動時有效，爲了將元素保持在固定位置，元素的LEFT偏移量會增加。因此，不僅滾動窗口時滑塊值會因鼠標更改而增加，而且還會因左側偏移而增加。結果是一個快速移動的滑塊。

要解決此問題，請將滑塊元素位置更改爲相對並調整頂部和左側偏移。但是，這意味着當窗口滾動時，滑塊的左端將滾動到視圖外，但至少您的滑塊以正常速度移動。

來源

2012-02-18 06:17:19 Simon

嗨，西蒙，非常感謝幫助我！我試圖讓代碼工作，但結果是一樣的，它仍然滾動得太快！（我已經更新了網站[here]（http://djlol.dk/projects/index2.html））。我可能錯過了一些簡單的東西，你知道它會是什麼嗎？ – 2012-02-20 07:46:10

對不起西蒙，我沒有正確測試我的解決方案，所以它是不正確的。我已經弄清楚它是什麼。閱讀我的新答案。 – Simon 2012-02-20 18:40:20

製作滑塊滾動頁面

回答

相關問題