编程 Javascript

用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常见注意事项

Jan 01 Javascript

prototype 学习笔记整理

Jul 17 Javascript

Js(JavaScript)中,弹出是或否的选择框示例(confirm用法的实例分析)

Jul 09 Javascript

jQuery的控件及事件(输入控件及回车事件)使用示例

Jul 25 Javascript

JS判断字符串长度的5个方法（区分中文和英文）

Mar 18 Javascript

EasyUI加载完Html内容样式渲染完成后显示

Jul 25 Javascript

vue中页面跳转拦截器的实现方法

Aug 23 Javascript

js删除数组中的元素delete和splice的区别详解

Feb 03 Javascript

微信小程序云开发如何使用云函数生成二维码

May 18 Javascript

解决vue-pdf查看pdf文件及打印乱码的问题

Nov 04 Javascript

vue 使用微信jssdk,调用微信相册上传图片功能

Nov 13 Javascript

vue 使用 v-model 双向绑定父子组件的值遇见的问题及解决方案

Mar 01 Vue.js

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实现蜘蛛访问日志统计

2013/07/05 PHP

php获取字段名示例分享

2014/03/03 PHP

php截取字符串之截取utf8或gbk编码的中英文字符串示例

2014/03/12 PHP

调用WordPress函数统计文章访问量及PHP原生计数器的实现

2016/03/21 PHP

Laravel框架中Blade模板的用法示例

2017/08/30 PHP

PDO::query讲解

2019/01/29 PHP

屏蔽网页右键复制和ctrl+c复制的js代码

2013/01/04 Javascript

node.js中的fs.statSync方法使用说明

2014/12/16 Javascript

jQuery检测鼠标左键和右键点击的方法

2015/03/17 Javascript

jQuery实用技巧必备（下）

2015/11/03 Javascript

JavaScript+html5 canvas实现本地截图教程

2020/04/16 Javascript

浅谈JavaScript for循环闭包

2016/06/22 Javascript

用JS实现轮播图效果（二）

2016/06/26 Javascript

bootstrapfileinput实现文件自动上传

2016/11/08 Javascript

在JS中a标签加入单击事件屏蔽href跳转页面

2016/12/16 Javascript

Angular 4依赖注入学习教程之InjectToken的使用（八）

2017/06/04 Javascript

VUE 实现复制内容到剪贴板的两种方法

2019/04/24 Javascript

javascript面向对象程序设计实践常用知识点总结

2019/07/29 Javascript

使用Python中的greenlet包实现并发编程的入门教程

2015/04/16 Python

python中pylint使用方法(pylint代码检查)

2018/04/06 Python

python+pyqt5实现KFC点餐收银系统

2019/01/24 Python

对python中的try、except、finally 执行顺序详解

2019/02/18 Python

python 魔法函数实例及解析

2019/09/25 Python

pytorch 实现tensor与numpy数组转换

2019/12/27 Python

Numpy中的数组搜索中np.where方法详细介绍

2021/01/08 Python

英国领先的男装设计师服装购物网站：Mainline Menswear

2018/02/04 全球购物

超市实习总结自我鉴定

2013/09/19 职场文书

连锁经营管理专业大学生求职信

2013/10/30 职场文书

教师个人鉴定材料

2014/02/08 职场文书

国家励志奖学金个人先进事迹材料

2014/05/04 职场文书

学习方法演讲稿

2014/05/10 职场文书

幼儿园秋季开学寄语

2014/08/02 职场文书

2014教育局对照检查材料思想汇报

2014/09/23 职场文书

中学生检讨书1000字

2014/10/28 职场文书

2015年度酒店客房部工作总结

2015/05/25 职场文书

美容院管理规章制度

2015/08/05 职场文书