轉換垂直滾動到水平DIV位置的jQuery

已與此對抗了一段時間。似乎很簡單，但我似乎缺乏使其運作所需的邏輯。轉換垂直滾動到水平DIV位置的jQuery

我要垂直.scrollTop位置轉換成表示用戶在文檔中的垂直位置單槓。

我覺得我的數學是可怕的;準備好在火焰中被擊落。

var pos = $("#content").scrollTop(); 
var convert = (pos/1024); 

$(document).scroll(function() { 
    $(".place").animate({ 
     left: '+=' + pos 
    }, slow); 
});

這是我到目前爲止的一個fiddle。 '地方'div不想移動。

來源

2012-07-27 gimme5

像[這個（http://jsfiddle.net/SzLNg/8/）？ – AbstractChaos 2012-07-27 11:18:21

差不多！驚人。唯一的要求是.place的移動被限制在0 - 1024px。無論窗口（或#content）的高度是多少，該運動都應該相對於垂直滾動位置而言...我認爲這就是爲什麼我試圖將#content的高度除以1024 ... – gimme5 2012-07-27 11:23:34

開始由滾動位置轉換成百分比

var s = $(window).scrollTop(), 
    d = $(document).height(), 
    c = $(window).height(); 
    var percent = scrollPercent = (s/(d-c))

然後通過使用比例爲.placebar的寬度讓您的當前位置

var newPos = percent*1024; 

if(newPos > 984) { //check to stop limit 
    newPos = 984; 
} 

$("#place").stop().animate({ 
    left: newPos +"px" 
});

Fiddle

來源

2012-07-27 11:39:04 AbstractChaos

美麗。非常感謝你，這種方法非常有意義，我一直希望自己能想到它。 @AbstractChaos規則 – gimme5 2012-07-27 11:43:48

轉換垂直滾動到水平DIV位置的jQuery

回答

相關問題