隐藏元素,保留功能

将元素的透明度改为全透明:opacity:0;    filter:Alpha(opacity=0),两个是为了解决浏览器兼容问题,透明度兼容性:

filter: alpha(opacity=80);              //IE

-moz-opacity:0.8;                       //火狐

opacity:0.8;                            //其他浏览器

<div class="" style=" position: absolute; top:75px; right:0px; opacity: 0; filter:Alpha(opacity=0);">
   <input type="file"  />
</div>
时间: 2024-10-24 15:35:44

隐藏元素,保留功能的相关文章

CSS“隐藏”元素的几种方法的对比

一说起CSS隐藏元素,我想大部分小伙伴们都会想到的第一种方法就是设置display为none.这是最为人所熟知也是最常用的方法.我相信还有不少人想到使用设置visibility为hidden来隐藏元素,这种方式也是常用的方法,而且也有很多人知道两者的不同.除了这两种方法,本文还总结了一些比较不常用的方法,比较了这几种“隐藏”元素方法的区别和优缺点,欢迎大家交流!! 几种方法的简单介绍 首先我们分别来说说到底有哪几种隐藏元素的方法,有一些方法是众所周知的,还有一些算是一种技巧. display:n

js获取隐藏元素宽高的方法

网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>test</title> </head> <bo

两种隐藏元素方式【display: none】和【visibility: hidden】的区别及由此引出的问题

此前看到一随笔(@任天缘 原文)讲了这个问题,并总结了: [display: none]:隐藏元素及元素内的所有内容,并且该元素的位置.宽高等其他属性值一并“消失”: [visibility: hidden]:隐藏元素及元素内的所有内容,但是该元素的位置.宽高等属性值仍然还在. 也有总结:(@Nicholas_F の 领域 原文) display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到. visibility:hidden--- 使对

jQuery无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案

用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢工了. 用Chrome自带的开发工具一查,发现罢工的Tab中.小插件一些重要元素的宽度都变成“0”了,因为这个小插件需要计算动态宽度来实现,于是马上想到是小插件中的宽度获取失败了,果不其然. 汗,居然一直没发现jQuery无法获取隐藏元素(display:none)的宽度(width)和高度(height),为了兼容IE6,我用1.x版,而且是官方

CSS之选择符、链接、盒子模型、显示隐藏元素

<html> <head> <meta charset="utf-8"> <title>选择符.链接.盒子模型.显示隐藏元素</title> <style> a:link{ color:red; } a:visited{ color:black; } a:hover{ color:blue; } a:active{ color:green; } </style> </head> <bo

JS实现原理-隐藏元素的显现

在CSS布局中,我们需要设置隐藏元素,以实现加载事件后出现的效果.我们列举一下隐藏的方法: 1.display:none://设置元素消失: 2.visibility:hidden://设置元素隐藏: 3.width/height://可以实现拉链式显示: 4.透明度://可以渐隐渐显的效果: 5.改变left/top设置://实现抽屉式特效: 6.背景色DIV盖住元素://花式显示特效:

如何获取隐藏元素的宽高

获取隐藏元素(display:none)的物理尺寸 问题及场景 假如我们有这样一个输入框,点击能展开选择.如下图: 在这里输入框和下方的展开区域是分离的,独立的两个控件!初始状态下面的可选框是隐藏的(ng-show=false) 展开区域中可折叠组件accordion(对应图中省份,排序字段,短消息部分)的高度是随着数据自适应撑开,点击accordion折叠收缩时有一个高度变化的动画效果! 在计算accordion的高度时却无法获取数据节点元素的高度,导致accordion的高度为0,无法折叠!

页面滚动显示或隐藏元素Headroom.js插件帮助你实现滚动效果

Headroom.js 是什么? Headroom.js 是一个轻量级.高性能的JS小工具(不依赖任何工具库!),它能在页面滚动时做出响应.此页面顶部的导航条就是一个鲜活的案例,当页面向下滚动时,导航条消失,当页面向上滚动时,导航条就出现了. Headroom.js 有什么用? 固定页头(导航条)可以方便用户在各个页面之间切换.但是这也会带来些问题…本文原创博客地址:http://www.cnblogs.com/unofficial官网地址:www.pushself.com) 大屏幕一般都是宽度

隐藏元素、浮动元素、定位元素

<html> <head> <meta charset="utf-8"> <title>隐藏元素.浮动元素.定位元素</title> <style> p{ width:300px; background:pink; } #column{ background:pink; width:33%; float:left; border-top:1px solid white; border-left:2px solid

隐藏元素的URL是否加载

结论chrome: 隐藏的元素及其包含的背景图不会加载(样式隐藏元素的当前背景会加载). hover的背景图不会加载,当hover时才加载. 隐藏的img或img在隐藏的元素内也会加载. 没有匹配的样式中,包含的背景不会显示. 使用JS给隐藏的元素设置背景图时,会加载背景图. 结论IE: hover的背景图不会加载,当hover时才加载. 没有匹配的样式中,包含的背景不会显示.