摘要:如果為,元素的底端將和其所在滾動區(qū)的可視區(qū)域的底端對齊。根據(jù)可見區(qū)域最靠近元素的哪個邊緣,元素的頂部將與可見區(qū)域的頂部邊緣對準(zhǔn),或者元素的底部邊緣將與可見區(qū)域的底部邊緣對準(zhǔn)。
[TOC]
scrollIntoView系列移動web頁面,input獲取焦點彈出系統(tǒng)虛擬鍵盤時,偶爾會出現(xiàn)擋住input的情況,盡管概率不大,但是十分影響用戶體驗。
scrollIntoViewelement.scrollIntoView(alignToTop);
alignToTop
Boolean
如果為true,元素的頂端將和其所在滾動區(qū)的可視區(qū)域的頂端對齊。
如果為false,元素的底端將和其所在滾動區(qū)的可視區(qū)域的底端對齊。
scrollIntoViewIfNeededElement.scrollIntoViewIfNeeded(opt_center)
opt_center
Boolean 默認(rèn)true
如果為true,則元素將在其所在滾動區(qū)的可視區(qū)域中居中對其。
如果為false,則元素將與其所在滾動區(qū)的可視區(qū)域最近的邊緣對齊。 根據(jù)可見區(qū)域最靠近元素的哪個邊緣,元素的頂部將與可見區(qū)域的頂部邊緣對準(zhǔn),或者元素的底部邊緣將與可見區(qū)域的底部邊緣對準(zhǔn)。
推薦使用 scrollIntoViewIfNeeded
代碼實例
$("input").on("click", function () { var target = this; // 使用定時器是為了讓輸入框上滑時更加自然 setTimeout(function(){ // target.scrollIntoView(true); target.scrollIntoViewIfNeeded(true); // 推薦使用 },100); });
參考:
https://github.com/justjavac/...
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/90499.html
摘要:當(dāng)運行時,如果不為,則將超時函數(shù)推送到事件隊列,并且函數(shù)退出,從而使調(diào)用堆棧清零。因此,該方法從頭到尾不經(jīng)過直接遞歸調(diào)用即可處理,因此調(diào)用堆棧保持清晰,無論迭代次數(shù)如何。 前端常用代碼片段(一) 點這里前端常用代碼片段(二) 點這里前端常用代碼片段(三) 點這里前端常用代碼片段(四) 點這里 1.tap事件點透問題? 問題點擊穿透問題:點擊蒙層(mask)上的關(guān)閉按鈕,蒙層消失后發(fā)現(xiàn)觸...
摘要:先來看一段代碼可以看到很多,來整理一下,總共有三大類我自己分的,沒有科學(xué)依據(jù)除了一些私有屬性方法比如的私有屬性等和一些空的屬性根據(jù)類型又分為了幾個小分類普通屬性樣式屬性操作屬性其他對象屬性我不知道的類型下一節(jié)詳細(xì)分析 先來看一段代碼: var dom = document.querySelector(body); for(var i in dom){ console.log(i...
摘要:輸入框首尾清除空格在中監(jiān)聽鍵盤事件移動端底部被彈出的鍵盤遮擋輸入框是通過一直放在頁面底部,當(dāng)點擊進(jìn)行輸入的時候,就會出現(xiàn)如下圖片情況有的機型會遮擋一些。 前言 input是我們接受來自用戶的數(shù)據(jù)常用標(biāo)簽,在前端開發(fā)中,相信每個人都會用到這個標(biāo)簽,所以在開發(fā)過程中也時候也會遇到一些問題,本文的內(nèi)容是我在跟input相愛相殺過程中產(chǎn)生的,在此記錄分享一下。如果喜歡的話可以點波贊/關(guān)注,支持...
摘要:輸入框首尾清除空格在中監(jiān)聽鍵盤事件移動端底部被彈出的鍵盤遮擋輸入框是通過一直放在頁面底部,當(dāng)點擊進(jìn)行輸入的時候,就會出現(xiàn)如下圖片情況有的機型會遮擋一些。 前言 input是我們接受來自用戶的數(shù)據(jù)常用標(biāo)簽,在前端開發(fā)中,相信每個人都會用到這個標(biāo)簽,所以在開發(fā)過程中也時候也會遇到一些問題,本文的內(nèi)容是我在跟input相愛相殺過程中產(chǎn)生的,在此記錄分享一下。如果喜歡的話可以點波贊/關(guān)注,支持...
閱讀 3507·2023-04-26 01:45
閱讀 2296·2021-11-23 09:51
閱讀 3722·2021-10-18 13:29
閱讀 3534·2021-09-07 10:12
閱讀 758·2021-08-27 16:24
閱讀 1873·2019-08-30 15:44
閱讀 2242·2019-08-30 15:43
閱讀 3049·2019-08-30 13:11