div_隐藏显示

http://www.icoa.cn/a/617.html

http://my.oschina.net/xsh1208/blog/215811

1、方式1:

display:none|block;

display:none;

  隐藏该html元素,确切的说,是在浏览器中消除该元素,不占屏幕的空间。若其下有其他元素,就会上移到该空间区域(好像桌子上有100块钱,现在我把它放在抽屉里藏起来,桌子上放100钱的地方可以放在其他任何东西)。

dispaly:block;

  显示已经隐藏的html元素,如果别的元素占有了该空间时,他将下移,空间重新别原来的元素占有。(把100块钱重新从抽屉里那出来放回桌子上)。

2、方式2:

visibility:hidden|visible;

visibility:hidden;

  隐藏该元素,正真的隐藏,但他还占有那块空间。这时,(桌子上有100块钱,这是我盖了桌布把他隐藏起来,钱还在那里)。

visibility:visible;

  让元素显示(拿掉了桌布,看到了100块钱)。

所以display和visibility控制的分别是html元素是否存在和是否显示,display的属性定义该元素存在或不存在,而visibility的属性只是控制该元素是否显示出来,实际上还是存在的。

注意:

使用display方式更人性化,但是,用div.style.display="none"隐藏会引起,div里面的东西休眠,里面的事件就不响应了。

最好将div里面的对象的width或height设成0.比如:div里面有一个player的iframe.
document.frames[‘player‘].frameElement.height=0;

C

时间: 2024-10-06 10:10:57

div_隐藏显示的相关文章

【锋利的JQuery-学习笔记】输入框提示语-隐藏/显示

html <div class="search"> <input type="text" id="inputSearch" class="" value="请输入商品名称"/> </div> css: #inputSearch { border: 1px solid #BABEBF; color: #999999; font-size: 14px; height: 17p

jquery实现的点击页面其他地方隐藏显示的元素

jquery实现的点击页面其他地方隐藏显示的元素:在实际应用中,可能有这样的效果,那就是有这样一个弹出层,点击层本身的时候,这个层不会隐藏,而点击除去层之外的页面其他地方则会将这个层隐藏,下面就通过代码实例介绍一下如何实现此效果.代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="

基于特定值来推断隐藏显示元素的jQuery插件

jQuery-Visibly是一款小巧简单的jQuery隐藏显示元素插件.该插件依据某个元素的值,例如以下拉框的值.输入框的值等来推断是否显示某个指定的元素. 用于推断的值能够是单个值,或者是多个值,也能够是正則表達式,很灵活. 在线演示:http://www.htmleaf.com/Demo/201503111503.html 下载地址:http://www.htmleaf.com/jQuery/Layout-Interface/201503111502.html

Android 仿QQ浏览器WebView,滑动隐藏显示ActionBar效果

Android 仿QQ浏览器,滑动隐藏显示ActionBar效果. 往上推,是一个ScrollView会将,actionbar以及内容往上推,当actionbar消失后,将滚动Webview的内容. 此效果是基于QuickReturnHeader源码,修改而来的,代码也不多,实现方法比较简单. 直接上demo:http://download.csdn.net/detail/xufeifandj/8388493 直接看效果图:

.Net常用技巧_隐藏/显示DataGridView的行/等待框(转)

//當主表選擇行更改後,顯示相應的採購資料 private void dgvMain_SelectionChanged(object sender, EventArgs e) { if (this.dgvMain.SelectedRows.Count > 0 && this.dgvItem.DataSource != null && this.dgvItem.Rows.Count > 0) { string fMaterielCode = this.dgvMai

jQuery 学习02——效果:隐藏/显示、淡入淡出、滑动、动画、停止动画、Callback、链

jQuery 效果- 隐藏hide()和显示show() 语法: $(selector).hide(speed,callback);$(selector).show(speed,callback); (可选)speed  参数:规定隐藏/显示的速度,可以取以下值:"slow"."fast" 或毫秒. (可选)callback 参数:是隐藏或显示完成后所执行的函数名称. 例1:使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: <scrip

angularjs2 ng2 密码隐藏显示

代码结合ionic2开发移动端项目,注册页的密码的input一般用password, 但是用户输入密码时可能会输入错误,需要显示成text. 如图: 首先,输入框的类型判断: 1 <ion-input type="{{pwshow?'text':'password'}}" placeholder="输入密码"></ion-input> 然后,添加眼睛的点击事件,ngClass判断图标样式: 1 <a href="javascr

JQuery效果隐藏/显示

hide() 方法 语法 $(selector).hide(speed,callback) show() 方法 语法 $(selector).show(speed,callback) 参数 描述 speed 可选.规定元素从可见到隐藏的速度.默认为 "0". 可能的值: 毫秒 (比如 1500) "slow" "normal" "fast" 在设置速度的情况下,元素从可见到隐藏的过程中,会逐渐地改变其高度.宽度.外边距.内边距

关于元素隐藏/显示的各种方法

元素的隐藏/显示可以说数使用频率最高的方法之一,比如二级菜单,响应式布局,透明过度等等许许多多的特效都会使用到,以下介绍一下元素隐藏的各属性以及他们的特性和使用方法:display  visibility  opacity  overflow  position 我们先设置一些共有属性: <head> <style> div{ width: 100px; height: 100px; background-color: #444; margin: 10px; color: #f00