2012-10-04 30 views
1

所以我有一個拆分視圖markdown編輯器,我正在爲Win8構建JS。在左邊是一個textarea字段(上面有一個標題,所以它不是屏幕的整個高度)。在右邊我有一個包含markdown預覽的輸出的div。此預覽窗口是屏幕的整個高度。當我滾動左邊的textarea時,我想保持正確的預覽面板同步。我可以通過計算textarea的滾動百分比然後將預覽div滾動到相同位置來輕鬆完成此操作。通過JavaScript獲取Textarea滾動百分比

現在我很想知道,我無法弄清textarea的最大滾動值。我所看到的所有例子都是當你滾動的時候保持兩個元素同步的時候會涉及兩個帶有溢出設置的div。所以在div上你可以快速確定實際的高度。

有沒有辦法讓textarea的最大滾動大小(不是textarea的實際大小),所以我可以計算出百分比?我能想到的唯一解決方案是製作一個隱藏的div與textarea相同的大小,並將內容輸出到該文件,然後將textarea滾動同步到該文件,確定百分比,然後將其應用於較大的預覽div。我擔心這會對我的應用產生性能影響。

回答

2

你需要(element.scrollTop + element.offsetHeight)/ element.scrollHeight * 100

+0

謝謝,我就是這麼做的,但我找到了我的問題的根源,以選擇與jQuery textarea的。出於某種原因,當我做$('#input')。scrollHeight是未定義的,但手動選擇元素document.getElementById('input');允許我訪問scrollHeight。 –