使用JavaScript动态设置样式实现代码及演示动画


Posted in Javascript onJanuary 25, 2013

今天做了一个css的练习,效果有点象Maxthon首页一样。使用onmouseover和onmouseout事件实现不同的效果。如:
使用JavaScript动态设置样式实现代码及演示动画
你可以使用下面javascript。

<script type="text/javascript"> 
function DynamicSetStyle(id, attr, val) { 
var element = document.getElementById(id); 
if (element) element.style[attr] = val; 
} 
</script>

fieldset应用上面的javascript的DynamicSetStyle方法。
<fieldset id="fs1" style="margin: 10px; padding: 10px; width: 170px; text-align: center;" 
onmouseover="DynamicSetStyle('fs1','border-color','#3599ff')" onmouseout="DynamicSetStyle('fs1','border-color','')"> 
ERP 
<a href="http://xxx.xxx.com/erp" target="_blank">http://xxx.xxx.com/erp </a> 
</fieldset>
Javascript 相关文章推荐
Gird事件机制初级读本
Mar 10 Javascript
输入密码检测大写是否锁定js实现代码
Dec 03 Javascript
js window.onload 加载多个函数和追加函数详解
Jan 08 Javascript
JQuery1.8 判断元素是否绑定事件的方法
Jul 10 Javascript
JavaScript使用setInterval()函数实现简单轮询操作的方法
Feb 02 Javascript
纯JS实现可拖拽表单的简单实例
Sep 02 Javascript
vue轮播图插件vue-awesome-swiper的使用代码实例
Jul 10 Javascript
angular之ng-template模板加载
Nov 09 Javascript
JS实现网页抢购功能(触发,终止脚本)
Nov 27 Javascript
vue实现tab切换外加样式切换方法
Mar 16 Javascript
从零开始在NPM上发布一个Vue组件的方法步骤
Dec 20 Javascript
VUE解决跨域问题Access to XMLHttpRequest at
May 06 Vue.js
jQuery获取Select选择的Text和Value(详细汇总)
Jan 25 #Javascript
javascript面向对象包装类Class封装类库剖析
Jan 24 #Javascript
js iframe跨域访问(同主域/非同主域)分别深入介绍
Jan 24 #Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
Jan 24 #Javascript
ajax处理php返回json数据的实例代码
Jan 24 #Javascript
一个级联菜单代码学习及removeClass与addClass的应用
Jan 24 #Javascript
js屏蔽鼠标键盘(右键/Ctrl+N/Shift+F10/F11/F5刷新/退格键)
Jan 24 #Javascript
You might like
PHP写UltraEdit插件脚本实现方法
2011/12/26 PHP
PHP服务器页面间跳转实现方法
2012/08/02 PHP
PHP字符串长度计算 - strlen()函数使用介绍
2013/10/15 PHP
php中调用其他系统http接口的方法说明
2014/02/28 PHP
php获取指定日期之间的各个周和月的起止时间
2014/11/24 PHP
求帮忙修改个php curl模拟post请求内容后并下载文件的解决思路
2015/09/20 PHP
php实现微信公众平台账号自定义菜单类
2015/10/11 PHP
php中static和const关键字用法分析
2016/12/07 PHP
php微信公众号开发(4)php实现自定义关键字回复
2016/12/15 PHP
基于jquery的分页控件(C#)
2011/01/06 Javascript
给页面渲染时间加速 干掉Dom Level 0 Event
2012/12/19 Javascript
JQuery在页面中添加和除移DOM示例代码
2013/06/24 Javascript
Javascript学习笔记之相等符号与严格相等符号
2014/11/23 Javascript
深入理解JavaScript系列(33):设计模式之策略模式详解
2015/03/03 Javascript
javascript去除空格方法小结
2015/05/21 Javascript
使用JavaScript实现连续滚动字幕效果的方法
2015/07/07 Javascript
JavaScript事件 &quot;事件对象&quot;的注意要点
2016/01/14 Javascript
Angular directive递归实现目录树结构代码实例
2017/05/05 Javascript
Vue2.0 axios前后端登陆拦截器(实例讲解)
2017/10/27 Javascript
微信小程序开发中var that =this的用法详解
2020/01/18 Javascript
JavaScript对象原型链原理解析
2020/01/22 Javascript
原生JavaScript实现进度条
2021/02/19 Javascript
[01:03:33]Alliance vs TNC 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/18 DOTA
python抓取最新博客内容并生成Rss
2015/05/17 Python
Python + Flask 实现简单的验证码系统
2019/10/01 Python
python接口自动化如何封装获取常量的类
2019/12/24 Python
Python中格式化字符串的四种实现
2020/05/26 Python
教师的实习鉴定
2013/12/15 职场文书
英语教学随笔感言
2014/02/20 职场文书
工程项目经理任命书
2014/06/05 职场文书
班级课外活动总结
2014/07/09 职场文书
执法作风整顿剖析材料
2014/10/11 职场文书
实习单位意见
2015/06/04 职场文书
初中开学典礼新闻稿
2015/07/17 职场文书
应届生们该怎么书写求职信?
2019/07/05 职场文书
不同品牌、不同型号对讲机如何互相通联
2022/02/18 无线电