Windowï¼scrollY 屿§
åºçº¿
广æ³å¯ç¨
*
èª 2015å¹´7æ èµ·ï¼æ¤ç¹æ§å·²å¨ä¸»æµæµè§å¨ä¸å¾å°æ¯æï¼å¯å¨å¤§å¤æ°è®¾å¤åæµè§å¨çæ¬ä¸æ£å¸¸ä½¿ç¨ã
* æ¤ç¹æ§çæäºé¨åçæ¯æç¨åº¦å¯è½ææä¸åã
Window æ¥å£ç scrollY åªè¯»å±æ§è¿åææ¡£å½ååç´æ»å¨çåç´ æ°ãå¨ç°ä»£æµè§å¨ä¸ï¼è¯¥å¼æ¯äºåç´ ç²¾ç¡®çï¼è¿æå³çå®ä¸ä¸å®æ¯æ´æ°ãä½ å¯ä»¥ä» scrollX 屿§è·åææ¡£æ°´å¹³æ»å¨çåç´ æ°ã
å¼
ä¸ä¸ªå精度浮ç¹å¼ï¼è¡¨ç¤ºææ¡£å½åç¸å¯¹åç¹åç´æ»å¨çåç´ æ°ï¼æ£å¼è¡¨ç¤ºå
容å䏿»å¨ï¼ä»¥é²åºåºé¨æ´å¤å
容ï¼ãæ´ææ¯å°è¯´ï¼scrollY è¿åå½åè§å£ä¸è¾¹ç¼ç Y åæ ãå¦æææ¡£å®å
¨æ²¡æä¸ä¸æ»å¨ï¼å scrollY 为 0ãå¦ææ²¡æè§å£ï¼è¿åå¼ä¸º 0ãå¦æææ¡£å¨äºåç´ ç²¾ç¡®ç设å¤ä¸æ¸²æï¼åè¿åå¼ä¹æ¯äºåç´ ç²¾ç¡®çï¼å¹¶ä¸å¯è½å
å«å°æ°é¨åã
夿³¨ï¼å¦æä½ éè¦æ´æ°å¼ï¼å¯ä»¥ä½¿ç¨ Math.round() 对å
¶è¿è¡åèäºå
¥ã
Safari ä¼éè¿å° scrollY æ´æ°å°è¶
åºæå¤§æ»å¨ä½ç½®æ¥ååºè¿åº¦æ»å¨ï¼é¤éé»è®¤çâåå¼¹âææè¢«ç¦ç¨ï¼ä¾å¦éè¿å° overscroll-behavior 设为 noneï¼ï¼è Chrome å Firefox åä¸ä¼ãä¾å¦ï¼å¨ Safari ä¸ï¼å½ææ¡£å·²ä½äºé¡¶é¨æ¶ç»§ç»å䏿»å¨ï¼scrollY å¯è½åä¸ºè´æ°ã
æ¤å±æ§ä¸ºåªè¯»ãè¦å°çªå£æ»å¨å°ç¹å®ä½ç½®ï¼è¯·ä½¿ç¨ Window.scroll()ã
示ä¾
// ç¡®ä¿æ»å¨å°ç¬¬äºé¡µ
if (window.scrollY) {
window.scroll(0, 0); // å°æ»å¨ä½ç½®éç½®å°ææ¡£çå·¦ä¸è§ã
}
window.scrollByPages(1);
说æ
å¨ä½¿ç¨è¯¸å¦ scrollBy()ãscrollByLines() æ scrollByPages() çç¸å¯¹æ»å¨å½æ°æ¶ï¼å¯ç¨æ¤å±æ§æ£æ¥ææ¡£æ¯å¦å°æªè¢«æ»å¨ã
pageYOffset 屿§æ¯ scrollY 屿§çå«åãè¿æå³çå¦æä½ æ²¡æéæ°èµå¼è¿ä¸¤ä¸ªå±æ§ä¸çä»»ä¸å±æ§ï¼å window.pageYOffset === window.scrollY å§ç»ä¸ºçã
è§è
| è§è |
|---|
| CSSOM View Module > # dom-window-scrolly > |