使元素隱藏的方式彙總

2021-10-07 20:04:54 字數 1080 閱讀 9667

7、設定元素高為0

8、jq

css屬性設定display

不佔位且dom不載入

css屬性

佔位而且dom元素會載入

css屬性,設定透明度為0

佔位而且dom元素會載入

css屬性,超出部分隱藏,需要設定顯示的盒子比需要隱藏的小。比如乙個盒子

是30*30,裡面的內容是50*50,給盒子設定overflow:hidden 就是內容只顯

示30*30。

不佔位而且dom元素會載入

設定position:relative  相對定位,設定z-index:-1000

或者直接定位到超級遠的地方

不佔位而且dom元素會載入

縮放到0倍(看不見)
不佔位而且dom元素會載入

x和y設定很大的值,使其平移出螢幕外。(肯定也佔位呀)

也可以拆分成translatex(),translatey(),單位是px

不佔位而且dom元素會載入

同上也可拆分x,y,合在一起寫的話,x,y是數值型別,deg是角度單位,必須寫

比如說沿x軸旋轉。就是你拿張紙,面朝你旋轉90°。就是變成一條線了,等同於消

失(肯定也佔位呀)

不佔位而且dom元素會載入

height:0(肯定也佔位呀)
不佔位而且dom元素會載入

不佔位而且dom元素不會載入

原理是使用的就是display屬性,所以同樣不回載入

普通隱藏顯示

time為時間

function為執行完畢呼叫的函式(肯定也佔位呀)

透明度隱藏

time為時間

function為執行完畢呼叫的函式(肯定也佔位呀)

向上捲起隱藏

time為時間

function為執行完畢呼叫的函式(肯定也佔位呀)

React控制元素顯示隱藏的方式

react控制元素顯示和隱藏的方法如下 第一種是通過state變數來控制是否渲染元素,類似vue中的v if。第二種是通過style控制display屬性,類似vue 中的v show。第三種是通過動態切換classname。方法一 第一種方法是通過此例中showelem變數來控制是否載入元素的,如...

隱藏頁面元素的方式總結及區別

1 display none我不占地兒,你看不見我 display none可以讓網頁中所有內容不顯示,如 文字 鏈結 div層,是推薦的內容隱藏方式。2 visibility hidden我佔了地兒,你也看不見我 visibility hidden和display none可以隱藏的內容幾乎一樣,...

html顯示與隱藏元素的幾種方式

none 無 隱藏元素 block 顯示 轉換為塊級元素 不佔位 當隱藏的時候元素就完全沒有了。不能看見和操作該元素。優點 為其他元素讓出空間,如二級導航伸縮功能 或者另外乙個元素要佔據該位置時用起來比較方便。visible 顯示 hidden 隱藏 佔位 當隱藏時只是看不見,實際還是在那裡,但是也...