快捷搜索:  汽车  科技

javascript获得标签后修改属性(JavaScript-动态设置标签的隐藏)

javascript获得标签后修改属性(JavaScript-动态设置标签的隐藏)通过dv1.style获取的宽度和高度是字符串还会有px 所以无法与增速变量相加 因此使用parseInt()方法将获取的值转化为数字类型;后面必须加 px否则在谷歌 火狐等浏览器中无法使用 在IE中加与不加均可用js代码js代码设置div的width与height的属性首先获取div自身的宽度与高度 然后增加一个变大或者缩小的变量 使其变大或缩小

  • 显示与隐藏(简单模式)

以Div标签为例 其它标签以此类推进行设置即可

div的显示与隐藏是由CSS中的display属性决定 值为block显示;值为none隐藏

javascript获得标签后修改属性(JavaScript-动态设置标签的隐藏)(1)

html代码

控制div显示/隐藏:为两个按钮注册单击事件 单击隐藏时div隐藏 单击显示时显示 简单

javascript获得标签后修改属性(JavaScript-动态设置标签的隐藏)(2)

js代码

  • Div变大与缩小

设置div的width与height的属性

首先获取div自身的宽度与高度 然后增加一个变大或者缩小的变量 使其变大或缩小

javascript获得标签后修改属性(JavaScript-动态设置标签的隐藏)(3)

js代码

通过dv1.style获取的宽度和高度是字符串还会有px 所以无法与增速变量相加 因此使用parseInt()方法将获取的值转化为数字类型;后面必须加 px否则在谷歌 火狐等浏览器中无法使用 在IE中加与不加均可用

宽度与高度没做判断限制 还可以加上定时器使其自动变大或缩小

  • img图片跟着鼠标走

首先设置div的position属性值为absolute 其次获取鼠标当前位置 最后设置图片的top与left值为鼠标的当前位置

javascript获得标签后修改属性(JavaScript-动态设置标签的隐藏)(4)

js代码

设置好后的图片就会跟着鼠标在浏览器可视区域内进行移动

猜您喜欢: