環境： Rails的3.1rc5與jQuery的，Ubuntu 11.04，谷歌瀏覽器（13），Mozilla Firefox瀏覽器（6.0）jQuery的浮動頭是Laggy

我的工作，有一個相當有限，在辦公室的一個項目推出 - 所以我可以放心地說，我們將永遠在最新版本的Firefox中運行;我們可以做任何瘋狂的js，css3或html5我們想要的。

該項目旨在模仿一個應用程序，一個側欄（用於操作）和一個窗格中間有一個命令列表（橫向和縱向）滾動，而主體不滾動。

中間的面板具有我們需要的頁面向下浮動當用戶滾動訂單上面的標題。我們不能使用position：fixed，因爲我們需要水平滾動以及垂直滾動（與屏幕不動產相比，字段更多）。我有它的工作，但它在Chrome中是滯後的，在Firefox中非常滯後 - 在用戶停止滾動之前，頭似乎並沒有實際移動。

由於這是一種複雜的佈局，我試圖在jsfiddle中重新創建它，但是我無法讓它實際上使中間窗格上的滾動工作。這將至少給的什麼，我試圖做一個更好的主意：

http://jsfiddle.net/d3vkit/8E786/

這裏是我使用的CoffeeScript：

jQuery -> 
    order_headings_list = $("#order_headings_list") 
    orders_list = $("#orders_list") 

    orders_list.scroll -> 
    topOffset = orders_list.scrollTop() + "px" 
    order_headings_list.css('top', topOffset)

這裏是產生的JavaScript：

orders_list.scroll(function() { 
    var leftOffset, topOffset; 
    topOffset = orders_list.scrollTop() + "px"; 
    order_headings_list.css('top', topOffset); 
});

我唯一的想法是，這是因爲我正在將大量列表項移動到很多列表項上，可能它太多了。

我是不是正確地做這個浮動頭？任何指針來收緊東西？（爲什麼不是我搗鼓出溢出滾動？）

UPDATE

我曾多一點的的jsfiddle（http://jsfiddle.net/d3vkit/8E786/），並得到了頭部移動，表明發生滯後。在我看來，你滾動，並更新CSS，但不夠快，所以它似乎跳動。我怎樣才能解決這個問題？

來源

2011-08-19 d3vkit

爲什麼你在一個jQuery函數包裝的東西？此外，我真的不知道你想什麼來完成 – austinbv

我的印象是，我必須這樣做有它的文檔負荷運行下 - 我非常新的CoffeeScript，而實際使用的原型不是jQuery的多，所以也許這不需要？我想做一個垂直浮動標題，保持放在水平滾動，並與滾動div移動，但它不流暢。 – d3vkit

爲什麼不使用位置固定

http://jsfiddle.net/pnAvm/

來源

2011-08-19 20:58:58 austinbv

因爲我需要能夠水平滾動以及垂直滾動，但是在水平滾動中，固定位置元素隨滾動一起移動。我正在考慮試着用js來讀取監視器的大小，並改變字段的大小以適應寬度，所以沒有水平滾動，但是如果我們添加更多的字段，這可能會使事情複雜化。得到強大侷促）。 – d3vkit

jQuery的浮動頭是Laggy

UPDATE

回答

相關問題