分享JS代码实现鼠标放在输入框上输入框和图片同时更换样式
作者：yangzailu 时间：2024-05-22 10:41:02
废话不多说了，直接给大家贴关键代码了，具体代码如下所示：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="" />
<style type="text/css">
.box{width:1000px;margin:0 auto;height:500px;border:1px solid green;}
.tbox{width:150px;height:30px;border:1px solid #585858; margin:10px 10px;background-color:#eee;vertical-align:middle;background: url(re_code2.png) no-repeat #EEE 8px 8px;background-size: 15px;}
.ptes{width:115px;height:30px;}
.tbox1{width:150px;height:30px;border:1px solid red; margin:10px 10px;}
.pb1:hover {background-color:#eee;vertical-align:middle;background: url(re_code1.png) no-repeat #EEE 8px 8px;background-size: 15px;}
</style>
<script type="text/javascript"></script>
</head>
<body style="background-color:#FFF;">
<div class="box">
<div class="tbox" onmouseout="this.className='tbox'" onmousemove="this.className='tbox1 pb1'">
<div style="float: left; width:30px; height:30px;">
</div>
<div class="ptes" style="float: left;">
<input id="password" name="password" type="password" placeholder=" 请输入密码" value="" style="width:100％;height:26px;border-style:none"/>
</div>
</div>
<div>
</body>
</html>
以上所述是小编给大家介绍的分享JS代码实现鼠标放在输入框上输入框和图片同时更换样式网站的支持！
来源：http://www.cnblogs.com/yangzailu/archive/2016/09/01/5830215.html
标签：js,输入框,样式
0
投稿猜你喜欢
golang 格式化输入输出操作
2024-04-25 15:10:24
PyCharm Terminal终端命令行Shell设置方式
2021-06-22 19:30:02
Git分支合并冲突解决的方法实现
2023-12-08 08:41:47
MySQL中字符串索引对update的影响分析
2024-01-20 19:00:10
如何动态产生变量？
2009-11-18 16:33:00
python实现k-means聚类算法
2022-03-16 22:06:07
nodeJS express路由学习req.body与req.query方法实例详解
2024-06-05 09:52:34
opencv实现图像几何变换
2022-02-18 09:47:50
jupyter notebook使用argparse传入list参数
2022-12-25 16:54:03
pycharm2020.1.2永久破解激活教程，实测有效
2021-11-01 15:17:57
centos7.4系统中yum源安装mysql 5.6
2024-01-14 16:38:19
jQuery初学:find()方法及children方法的区别分析
2011-02-05 10:58:00
python后端接收前端回传的文件方法
2023-07-29 04:04:05
Python的内存泄漏及gc模块的使用分析
2023-09-17 18:07:30
MySQL索引优化之分页探索详细介绍
2024-01-16 12:05:17
Python enumerate遍历数组示例应用
2023-06-10 16:59:26
Golang限流库与漏桶和令牌桶的使用介绍
2024-05-10 13:57:50
修改、删除数据记录（DELETE\\UPDATE）
2009-02-27 15:50:00
pip安装提示Twisted错误问题（Python3.6.4安装Twisted错误）
2021-09-26 04:05:50
Python学习之私有函数,私有变量及封装详解
2022-05-28 13:47:15
