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下这里只好显示空白了。
相关推荐
-
jQuery实现点击水纹波动动画
jQuery点击水纹波动动画原理: 1.在需要实现水波纹效果的标签中添加<XXX class="ripple-wrapper"></XXX> 2.代码会定位 鼠标相对 与 标签的位置,以鼠标点为圆心画圆 3.圆的半径 可以自定义(默认为标签的最大宽或高度) 4.圆点颜色,和动画时间等可以自行修改内部代码,或直接 调用 $().css({})方法 进行覆盖 ripple-wrapper.js $(function(){ $(".r
-
JS实现很酷的水波文字特效实例
本文实例讲述了JS实现很酷的水波文字特效.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <title>JS实现很酷的水波文字效果</title> </head> <body bgcolor="#000000" onLoad="if (document.all)wave()"> <center> <div id='water' sty
-
纯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吧
-
javascript实现起伏的水波背景效果
本文实例为大家分享了js水波背景效果的实现代码,供大家参考,具体内容如下 效果图: 实现代码: <!DOCTYPE html> <html> <head> <title>水波背景</title> <meta charset="gb2312" /> <style> html, body {width:100%; height:100%; padding:0; margin:0;} </style&g
-
基于jQuery实现鼠标点击导航菜单水波动画效果附源码下载
基于jQuery鼠标点击水波动画竖直导航代码.这是一款基于jQuery+CSS3实现的带动画效果的竖直导航栏特效.效果图如下: 效果展示 源码下载 html代码: <div class="nav"> <ul> <li><a>网站首页</a></li> <li><a>关于我们</a></li> <li><a>产品中心</a>&l
-
js实现GridView单选效果自动设置交替行、选中行、鼠标移动行背景色
后台代码 复制代码 代码如下: /// <summary> /// 数据行绑定事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> protected void gvProduct_RowDataBound(object sender, GridViewRowEventArgs e) {
-
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
-
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
随机推荐
- 正则表达式对qq号码校验
- mui上拉加载功能实例详解
- FLEX ArrayCollection删除过滤的数据问题解决
- Ruby使用REXML库来解析xml格式数据的方法
- PostgreSQL中常用的时间日期脚本使用教程
- linux下apache开启url重写的方法(详细说明)
- mvc form表单提交的几种形式整理总结
- Ajax的使用代码解析
- PHP、Java des加密解密实例
- 常见浏览器多长时间会提示“脚本运行时间过长”总结
- jquery插件qrcode在线生成二维码
- asp截取字符串的两种应用 原创
- Spring boot实现热部署的两种方式详解
- 使用Spring AOP实现MySQL数据库读写分离案例分析(附demo)
- 用PHP产生动态的影像图
- php的4种常见运行方式
- php文件系统处理方法小结
- PHP四种排序算法实现及效率分析【冒泡排序,插入排序,选择排序和快速排序】
- 深入理解Spring中的Lookup(方法注入)
- pygame实现雷电游戏雏形开发