用jQuery toggleClass 实现鼠标移上变色


Posted in Javascript onMay 14, 2014

按钮移上变色效果

<style> 
.round-corner-btn { 
-moz-border-radius:4px; 
-webkit-border-radius: 4px; 
-khtml-border-radius: 4px; 
border-radius: 4px; width:200px; height:40px; line-height: 40px; 
background: green; 
display:inline-block; 
color:white; 
text-align : center; 
cursor: pointer; 
} 
.avatar_size{ 
font-size:12px; 
text-align: center; 
margin-top:4px; 
} 
.btn-hover{ 
opacity: 0.8; 
} 
</style> 
<div class='round-corner-btn'> 按钮</div> 
<script> 
$('.round-corner-btn').hover(function(){ 
$(this).toggleClass('btn-hover', 200); 
}) 
</script>
Javascript 相关文章推荐
javascript 面向对象编程基础:继承
Aug 21 Javascript
jQuery的.live()和.die() 使用介绍
Sep 10 Javascript
JavaScript生成GUID的多种算法小结
Aug 18 Javascript
用javascript删除当前行,添加行(示例代码)
Nov 25 Javascript
js使下拉列表框可编辑不止是选择
Dec 12 Javascript
从QQ网站中提取的纯JS省市区三级联动菜单
Dec 25 Javascript
javascript实现汉字转拼音代码分享
Apr 20 Javascript
jQuery复制节点用法示例(clone方法)
Sep 08 Javascript
js获取指定字符前/后的字符串简单实例
Oct 27 Javascript
浅谈webpack对样式的处理
Jan 05 Javascript
详解基于electron制作一个node压缩图片的桌面应用
Jan 29 Javascript
Javascript数组及类数组相关原理详解
Oct 29 Javascript
jquery ztree实现下拉树形框使用到了json数据
May 14 #Javascript
JQuery性能优化的几点建议
May 14 #Javascript
js 通过html()及text()方法获取并设置p标签的显示值
May 14 #Javascript
JQuery教学之性能优化
May 14 #Javascript
鼠标左键单击冲突的问题解决方法(防止冒泡)
May 14 #Javascript
javascript 中that的含义示例介绍
May 14 #Javascript
table insertRow、deleteRow定义和用法总结
May 14 #Javascript
You might like
php 无限极分类
2008/03/27 PHP
PHP将XML转数组过程详解
2013/11/13 PHP
apache中为php 设置虚拟目录
2014/12/17 PHP
PHP+MYSQL实现用户的增删改查
2015/03/24 PHP
Zend Framework入门教程之Zend_Session会话操作详解
2016/12/08 PHP
为javascript添加String.Format方法
2020/08/11 Javascript
js 去掉空格实例 Trim() LTrim() RTrim()
2014/01/07 Javascript
JavaScript中定义类的方式详解
2016/01/07 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
微信小程序加载更多 点击查看更多
2016/11/29 Javascript
详解使用grunt完成requirejs的合并压缩和js文件的版本控制
2017/03/02 Javascript
详解Vue使用命令行搭建单页面应用
2017/05/24 Javascript
AngularJS实现controller控制器间共享数据的方法示例
2017/10/30 Javascript
解决npm安装Electron缓慢网络超时导致失败的问题
2018/02/06 Javascript
jQuery获取随机颜色的实例代码
2018/05/21 jQuery
js根据需要计算数组中重复出现某个元素的个数
2019/01/18 Javascript
VuePress 静态网站生成方法步骤
2019/02/14 Javascript
微信小程序实现图片选择并预览功能
2019/07/25 Javascript
vue+flask实现视频合成功能(拖拽上传)
2021/03/04 Vue.js
Python创建普通菜单示例【基于win32ui模块】
2018/05/09 Python
在python中利用KNN实现对iris进行分类的方法
2018/12/11 Python
python 使用turtule绘制递归图形(螺旋、二叉树、谢尔宾斯基三角形)
2019/05/30 Python
Python 硬币兑换问题
2019/07/29 Python
Pycharm+Python工程,引用子模块的实现
2020/03/09 Python
Python figure参数及subplot子图绘制代码
2020/04/18 Python
使用Python实现微信拍一拍功能的思路代码
2020/07/09 Python
美国在线乐器和设备商店:Musician’s Friend
2018/07/06 全球购物
EJB发布WEB服务一般步骤
2012/10/31 面试题
幼儿园教师备课制度
2014/01/12 职场文书
会走路的树教学反思
2014/02/20 职场文书
置业顾问岗位职责
2014/03/02 职场文书
公司离职证明范本(5篇)
2014/09/17 职场文书
2014年团总支工作总结
2014/11/21 职场文书
护士医德考评自我评价
2015/03/03 职场文书
员工工作表扬信
2015/05/05 职场文书
办公室规章制度范本
2015/08/04 职场文书