您正在使用 IPV4 [54.226.222.183] 访问本站,您本次已经查看了 1 页
用户名: 密 码: 验证码:     用QQ登录本站
首页 软件 编程 笑话 知识 公告 台风 日历 计算器
悟空收录网       [公益]保护绿色环境,构建和谐社会      

【腾讯云】云服务器、云数据库、COS、CDN、短信等云产品特惠热卖中      
[公益] 地球是我家,绿化靠大家      
2024年 清明节 016
2024年 劳动节 043
2025年 元 旦 288
2025年 春 节 316
 
您现在的位置:首页 >> 脚本代码 >> 内容
本类新增
本类热门
js设置鼠标悬停改变背景色实现详解
内容摘要: html:divid='sign'thisistest!/divcss:styletype='text/css'.out{background-color:gray;}.over{background-color:red;}.down{background-color:yellow;}/styleWay1:js:$(function(){varsign=do......
html:

<divid="sign">thisistest!</div>

css:

<styletype="text/css">

.out{background-color:gray;}

.over{background-color:red;}

.down{background-color:yellow;}

</style>

Way1:

js:

$(function(){

varsign=document.getElementById("sign");

changBkColor(sign);

});

functionchangBkColor(obj){

obj.onmouseover=function(){this.className="over";};//鼠标悬停事件

obj.onmouseout=function(){this.className="out";};//鼠标离开事件

obj.onmousedown=function(){this.className="down";};//鼠标点击时触发事件

}

Way2:

JQuery

/*$(obj).hover(inFunction,outFunction)

*等同于$(obj).mouseover().mouseout();

*/

$(function(){

$('#sign').hover(function(){

$('#sign').addClass('over');

},function(){

$('#sign').removeClass('over').addClass('out');

});

});

版权声明:本内容来源于网络,如有侵犯您的版权,请联系站长,本站收到您的信息后将及时处理。
上一篇:js实现文字垂直滚动和鼠标悬停效果

 

下一篇:JS实现禁止用户使用Ctrl+鼠标滚轮缩放网页的方法

发布日期:2023/3/28
手机扫二维码直达本页
发布时间:12:52:13
点  击:10
录  入:壹家怡园
相关文章
Baidu
YiJiaCMS 7.3.8 build231228(MSSQL) 闽ICP备05000814号-1
本空间由腾讯云(轻量应用服务器)提供,Cloudflare提供加速防护
运行时间载入中.....