js实现鼠标悬浮给图片加边框的方法
作者:comeonstone 时间:2024-04-18 09:40:22
本文实例讲述了js实现鼠标悬浮给图片加边框的方法。分享给大家供大家参考。具体实现方法如下:
html代码:
<div class="T-s-l fl">
<a href="" class="a1">
<img src="images/11.jpg" width="234" height="368" />
</a><a href="" class="a2">
<img src="images/11.jpg" />
</a><a href="" class="a3">
<img src="images/11.jpg" />
</a>
</div>
js代码:
<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="js/jquery.insetborder.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
//border
$(".T-s-l a.a1").borderEffect();
$(".a1").borderEffect();
$(".T-s-l a.a2").borderEffect({ borderColor: '#e80484' });
$(".T-s-l a.a3").borderEffect({ borderColor: '#7b7b7b', speed: 300, borderWidth: 10 });
});
</script>
css代码:
.T-s-l a{background:url(images/download.png) no-repeat -10px 20px #fff;}
.T-s-l{width:952px;overflow:hidden;}
.T-s-l a{float:left; width:234px;height:368px;margin:0 19px 17px 0;font-size:0;overflow:hidden;}
希望本文所述对大家的javascript程序设计有所帮助。
标签:js,鼠标,方法
0
投稿
猜你喜欢
用python绘制彩色螺旋线代码
2023-04-30 15:32:18
python下10个简单实例代码
2023-01-31 19:38:20
xml文件调用css
2008-09-05 17:12:00
Python面向对象之继承原理与用法案例分析
2021-06-28 02:07:53
Python matplotlib画图时图例说明(legend)放到图像外侧详解
2021-03-05 13:42:45
php实现的一段简单概率相关代码
2023-11-23 02:20:28
PyQt5实现从主窗口打开子窗口的方法
2023-01-14 11:06:11
vue组件之间进行传值的方法
2024-04-27 15:48:04
详解Python list和numpy array的存储和读取方法
2022-05-04 05:58:10
jupyter notebook内核启动失败问题及解决方法
2022-09-21 02:31:04
利用MySqlBulkLoader实现批量插入数据的示例详解
2024-01-24 08:46:00
li隔行换色改进版
2024-04-29 13:40:23
解析如何用SQL语句在指定字段前面插入新的字段
2024-01-24 12:18:36
vue button的@click方法无效钩子函数没有执行问题
2024-06-05 10:02:51
利用python绘制中国地图(含省界、河流等)
2021-12-19 03:19:59
mysql远程跨库联合查询的示例
2024-01-13 23:09:10
python里面单双下划线的区别详解
2023-03-22 12:39:22
对pandas的层次索引与取值的新方法详解
2023-01-20 00:39:55
python调用matlab的方法详解
2023-10-18 06:39:02
python 已知三条边求三角形的角度案例
2022-09-06 01:18:41