js利用div背景,做一个竖线的效果。
后来发现,如果div样式,如果设置了具体的高度,无论ie还ff,都能正常的表现。
但这个高度并不是固定的,而是会随着旁边div内容的多少而变化。最后,只好借助javascript,加载时捕获有关的div的高度,将其赋值给指定的div样式,终于看到了想要的东西。
具体脚本是这样的:
window.onload=function(){
document.getElementById('bg').style.height=document.getElementById('mydiv').offsetHeight+'px';
}
“bg”是要更改高度的div,“mydiv”是相关要参照的div。
最后那个单位“px”一定要加上,否则在ff下会无法识别。
这还是有个问题,就是我看到有人介绍说offsetHeight这个属性在ie7下已经不被支持了,具体我没有试过。如果是这样的话,ie7下这里只好显示空白了。
相关推荐
-
纯js实现背景图片切换效果代码
html代码 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>背景切
-
Android项目实战手把手教你画圆形水波纹loadingview
本文实例讲解的是如何画一个满满圆形水波纹loadingview,这类效果应用场景很多,比如内存占用百分比之类的,分享给大家供大家参考,具体内容如下 效果图如下: 预备的知识: 1.贝塞尔曲线 如果你不了解,可以来这里进行基础知识储备:神奇的贝塞尔曲线 2.Paint.setXfermode() 以及PorterDuffXfermode 千万不要被这个b的名字吓到,不熟悉看到可能会认为很难记,其实 只要站在巨人的丁丁上 还是很简单的. 好了 废话不多说 ,跟我一步步来做一个炫酷的view吧
-
jQuery实现点击水纹波动动画
jQuery点击水纹波动动画原理: 1.在需要实现水波纹效果的标签中添加<XXX class="ripple-wrapper"></XXX> 2.代码会定位 鼠标相对 与 标签的位置,以鼠标点为圆心画圆 3.圆的半径 可以自定义(默认为标签的最大宽或高度) 4.圆点颜色,和动画时间等可以自行修改内部代码,或直接 调用 $().css({})方法 进行覆盖 ripple-wrapper.js $(function(){ $(".r
-
Android仿水波纹流量球进度条控制器
仿水波纹流球进度条控制器,Android实现高端大气的主流特效,供大家参考,具体内容如下 效果图: CircleView 这里主要是实现中心圆以及水波特效 package com.lgl.circleview; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.gra
-
javascript实现起伏的水波背景效果
本文实例为大家分享了js水波背景效果的实现代码,供大家参考,具体内容如下 效果图: 实现代码: <!DOCTYPE html> <html> <head> <title>水波背景</title> <meta charset="gb2312" /> <style> html, body {width:100%; height:100%; padding:0; margin:0;} </style&g
-
js实现GridView单选效果自动设置交替行、选中行、鼠标移动行背景色
后台代码 复制代码 代码如下: /// <summary> /// 数据行绑定事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> protected void gvProduct_RowDataBound(object sender, GridViewRowEventArgs e) {
-
基于jQuery实现鼠标点击导航菜单水波动画效果附源码下载
基于jQuery鼠标点击水波动画竖直导航代码.这是一款基于jQuery+CSS3实现的带动画效果的竖直导航栏特效.效果图如下: 效果展示 源码下载 html代码: <div class="nav"> <ul> <li><a>网站首页</a></li> <li><a>关于我们</a></li> <li><a>产品中心</a>&l
-
Android实现点击Button产生水波纹效果
先上图,看看接下来我要向大家介绍的是个什么东西,如下图: 接下来要介绍的就是如何实现上述图中的波纹效果,这种效果如果大家没有体验过的话,可以看看百度手机卫士或者360手机卫士,里面的按钮点击效果都是这样的,另外Android 5.0以上的版本也出现了这种效果.不多说,下面聊聊具体的怎么实现. 首先大家看到的是三个button,水波纹的出现给我们的错觉是直接将波纹绘制在button上面的,但是这样能做到吗?首先button自己有background和src,如果把半透明的水波纹当作backgrou
-
利用JQuery和JS实现奇偶行背景颜色自定义效果
JQuery实现: 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Conten
-
JS实现很酷的水波文字特效实例
本文实例讲述了JS实现很酷的水波文字特效.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <title>JS实现很酷的水波文字效果</title> </head> <body bgcolor="#000000" onLoad="if (document.all)wave()"> <center> <div id='water' sty
随机推荐
- VUEJS实战之利用laypage插件实现分页(3)
- ruby迭代map的简洁写法实现原理分析
- SQLServer2005 没有日志文件(*.ldf) 只有数据文件(*.mdf) 恢复数据库的方法
- Oracle教程 误添加数据文件删除方法
- Python序列化基础知识(json/pickle)
- ASP.NET用DataSet导出到Excel的方法
- js模态对话框使用方法详解
- PHP环境搭建的详细步骤
- 清空元素html("") innerHTML="" 与 empty()的区别和应用(推荐)
- Python虚拟环境Virtualenv使用教程
- Vue.js 2.0窥探之Virtual DOM到底是什么?
- Android开发之机顶盒上gridview和ScrollView的使用详解
- Nginx服务器中处理AJAX跨域请求的配置方法讲解
- 关于foreach循环中遇到的问题小结
- jsp页面显示数据库的数据信息表
- Powershell中定义常量的方法
- Java Iterator迭代器_动力节点Java学院整理
- Android数据持久化之读写SD卡中内容的方法详解
- JQuery与iframe交互实现代码
- Windows系统中Java调用cmd命令及执行exe程序的方法