JavaScript中關于iframe滾動條的去除和保留
在開發(fā)中經(jīng)常遇到去掉全部的滾動條,去掉右邊的滾動條且保留底下的滾動條,去掉底下的滾動條且保留右邊的滾動條,大家基于js是怎么實現(xiàn)的呢?下面通過本文給大家介紹下JavaScript中關于iframe滾動條的去除和保留的實現(xiàn)方法。一起看看吧!
iframe嵌入頁面后,我們有時需要調整滾動條,例如,去掉全部的滾動條,去掉右邊的滾動條且保留底下的滾動條,去掉底下的滾動條且保留右邊的滾動條。那么我們應該怎么做呢?
一:去掉全部的滾動條
第一個方法: iframe 有一個scrolling屬性,它有 auto , yes , no 這三個值。
scrolling : auto -----在需要的時候滾動條出現(xiàn)
scrolling : yes ------始終顯示滾動條
scrolling : no -------始終隱藏滾動條
當設置 scrolling : no 時,全部的滾動條就沒有了。
第二個方法:我發(fā)現(xiàn)除了 scrolling 可以去掉全部的滾動條外,還有另一個方法,在嵌入的頁面里設置 body{overflow:hidden},這樣也可以將滾動條去掉,而且這也是當我們只想去掉某一個滾動條所使用的屬性。
二:去掉右邊的滾動條且保留底下的滾動條
如果只想保留底下的滾動條,那么可以在嵌入的頁面里設置 body{overflow-x:auto ; overflow-y:hidden;}
三:去掉底下的滾動條且保留右邊的滾動條
在嵌入的頁面里設置 body{overflow-x:hidden;overflow-y:auto;}
我們已經(jīng)知道了這兩個屬性都可以設置滾動條的顯示和隱藏,那么當兩個同時設置時,會出現(xiàn)哪個效果呢?
通過檢測,我發(fā)現(xiàn)當 scrolling = " auto " 或者 " yes " 時,如果設置了 body,那么就會使用body里的設置;當 scrolling = " no " 時,不管body設置了什么,都會使用 scrolling 的設置,即全部的滾動條都被去掉了。
以上所述是小編給大家介紹的JavaScript中關于iframe滾動條的去除和保留的全部敘述,希望對大家有所幫助,如果大家有任何疑問歡迎給我留言,小編會及時回復大家的!
相關文章
JavaScript 高仿真可控彈簧振子實現(xiàn)代碼
我剛學JavaScript ,看見一些牛人寫了許多特效,我也花了一天寫了一個彈簧振子,完全獨創(chuàng),沒有借鑒任何人的代碼.2009-10-10
JavaScript+CSS實現(xiàn)模態(tài)框效果
這篇文章主要為大家詳細介紹了JavaScript+CSS實現(xiàn)模態(tài)框效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-07-07
如何基于uni-app實現(xiàn)微信小程序一鍵登錄與退出登錄功能
uni-app 是使用vue的語法+小程序的標簽和API的一套框架,是一套代碼多端使用,目前是大前端的一種趨勢,下面這篇文章主要給大家介紹了關于如何基于uni-app實現(xiàn)微信小程序一鍵登錄與退出登錄功能的相關資料,需要的朋友可以參考下2022-09-09
js在數(shù)組中刪除重復的元素自保留一個(兩種實現(xiàn)思路)
遍歷要刪除的數(shù)組arr, 把元素分別放入另一個數(shù)組tmp中,在判斷該元素在arr中不存在才允許放入tmp中,具體實現(xiàn)如下,需要的朋友可以看看2014-08-08
JavaScript中callee和caller的區(qū)別與用法實例分析
這篇文章主要介紹了JavaScript中callee和caller的區(qū)別與用法,結合實例形式分析了javascript中callee和caller的功能、區(qū)別、用法及操作注意事項,需要的朋友可以參考下2019-06-06

