使用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 相关文章推荐
fireworks菜单生成器mm_menu.js在 IE 7.0 显示问题的解决方法
Oct 20 Javascript
JS 仿腾讯发表微博的效果代码
Dec 25 Javascript
基于jquery实现导航菜单高亮显示(两种方法)
Aug 23 Javascript
js实现继承的5种方式
Dec 01 Javascript
微信小程序 devtool隐藏的秘密
Jan 21 Javascript
jQuery插件zTree实现删除树节点的方法示例
Mar 08 Javascript
jQuery UI Grid 模态框中的表格实例代码
Apr 01 jQuery
详解webpack进阶之loader篇
Aug 23 Javascript
mpvue项目中使用第三方UI组件库的方法
Sep 30 Javascript
微信小程序自定义联系人弹窗
May 26 Javascript
JavaScript逻辑运算符相关总结
Sep 04 Javascript
CocosCreator入门教程之网络通信
Apr 16 Javascript
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
手冲咖啡应该是现代精品咖啡店的必备选项吗?
2021/03/03 冲泡冲煮
解析php addslashes()与addclashes()函数的区别和比较
2013/06/24 PHP
一个漂亮的php验证码类(分享)
2013/08/06 PHP
PHP文件上传主要代码讲解
2013/09/30 PHP
PHP开发的文字水印,缩略图,图片水印实现类与用法示例
2019/04/12 PHP
js apply/call/caller/callee/bind使用方法与区别分析
2009/10/28 Javascript
js获取class的所有元素
2013/03/28 Javascript
JavaScript的strict模式与with关键字介绍
2014/02/08 Javascript
jquery form 隐藏的input 选择
2014/04/29 Javascript
JavaScript实现鼠标滑过处生成气泡的方法
2015/05/16 Javascript
详解AngularJS中自定义指令的使用
2015/06/17 Javascript
JavaScript基本数据类型及值类型和引用类型
2015/08/25 Javascript
JS数组排序技巧汇总(冒泡、sort、快速、希尔等排序)
2015/11/24 Javascript
15位和18位身份证JS校验的简单实例
2016/07/18 Javascript
JavaScript 实现的checkbox经典实例分享
2016/10/16 Javascript
网站发布后Bootstrap框架引用woff字体无法正常显示的解决方法
2016/11/24 Javascript
angularJs提交文本框数据到后台的方法
2018/10/08 Javascript
Angular刷新当前页面的实现方法
2018/11/21 Javascript
js实现经典贪吃蛇小游戏
2020/03/19 Javascript
Vue+ElementUI 中级联选择器Bug问题的解决
2020/07/31 Javascript
echarts实现晶体球面投影的实例教程
2020/10/10 Javascript
Python ZipFile模块详解
2013/11/01 Python
python使用calendar输出指定年份全年日历的方法
2015/04/04 Python
Python中获取对象信息的方法
2015/04/27 Python
python实现两个文件夹的同步
2019/08/29 Python
Pytorch evaluation每次运行结果不同的解决
2020/01/02 Python
Python利用Scrapy框架爬取豆瓣电影示例
2020/01/17 Python
校本教研工作制度
2014/01/22 职场文书
《小鹰学飞》教学反思
2014/04/23 职场文书
升国旗演讲稿
2014/09/05 职场文书
2014年预备党员群众路线教育实践活动对照检查材料思想汇报
2014/10/02 职场文书
小升初自荐信怎么写
2015/03/26 职场文书
2016优秀员工先进事迹材料
2016/02/25 职场文书
超级实用的公文标题大全!
2019/07/19 职场文书
Pytorch distributed 多卡并行载入模型操作
2021/06/05 Python
【海涛解说】暗牧也疯狂,牛蛙成配角
2022/04/01 DOTA