js實(shí)現(xiàn)鼠標(biāo)懸浮給圖片加邊框的方法
更新時(shí)間：2015年01月30日 10:59:29 作者：comeonstone
這篇文章主要介紹了js實(shí)現(xiàn)鼠標(biāo)懸浮給圖片加邊框的方法,涉及jquery.insetborder.js中borderEffect方法的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了js實(shí)現(xiàn)鼠標(biāo)懸浮給圖片加邊框的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：
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;}
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
JavaScript前端實(shí)現(xiàn)判斷登錄設(shè)備是移動(dòng)端還是PC
這篇文章主要為大家詳細(xì)介紹了JavaScript前端如何實(shí)現(xiàn)判斷登錄設(shè)備是移動(dòng)端還是PC,文中的示例代碼講解詳細(xì),有需要的小伙伴可以參考下2025-03-03
淺談layer的Icon樣式以及一些常用的layer窗口使用方法
今天小編就為大家分享一篇淺談layer的Icon樣式以及一些常用的layer窗口使用方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09
詳解ES6實(shí)現(xiàn)類的私有變量的幾種寫(xiě)法
這篇文章主要介紹了詳解ES6實(shí)現(xiàn)類的私有變量的幾種寫(xiě)法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-02-02
JavaScript中Object和Function的關(guān)系小結(jié)
JavaScript 中 Object 和 Function 的關(guān)系是微妙的，他們互為對(duì)方的一個(gè)實(shí)例。2009-09-09
編寫(xiě)js擴(kuò)展方法判斷一個(gè)數(shù)組中是否包含某個(gè)元素
判斷集合是否包含某個(gè)元素我們可以利用js的原型擴(kuò)展來(lái)封裝一個(gè)我們自己的Contains方法，具體思路及實(shí)現(xiàn)如下，感興趣的朋友可以參考下2013-11-11
編程語(yǔ)言中，函數(shù)Func(Type a,……)直接或間接調(diào)用函數(shù)本身，則該函數(shù)稱為遞歸函數(shù)。遞歸函數(shù)不能定義為內(nèi)聯(lián)函數(shù)。這篇文章主要介紹了JS中遞歸函數(shù)的相關(guān)資料,需要的朋友可以參考下2016-06-06
基于Bootstrap分頁(yè)的實(shí)例講解(必看篇)
下面小編就為大家?guī)?lái)一篇基于Bootstrap分頁(yè)的實(shí)例講解(必看篇)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
JavaScript電子時(shí)鐘倒計(jì)時(shí)
這篇文章主要介紹了JavaScript電子時(shí)鐘倒計(jì)時(shí)的實(shí)現(xiàn)代碼，具有一定的參考價(jià)值，感興趣的朋友可以參考一下2016-01-01
js實(shí)現(xiàn)for循環(huán)跳過(guò)undefined值示例
這篇文章主要介紹了js實(shí)現(xiàn)for循環(huán)跳過(guò)undefined值,結(jié)合實(shí)例形式分析了js使用for循環(huán)針對(duì)數(shù)組的遍歷、判斷、運(yùn)算等相關(guān)操作技巧,需要的朋友可以參考下2019-07-07
JavaScript中最容易混淆的作用域、提升、閉包知識(shí)詳解(推薦)
在web前端開(kāi)發(fā)中js中的作用域，提升，閉包知識(shí)是經(jīng)常用到的也是很容易混淆的知識(shí)點(diǎn)，接下來(lái)小編整理了本教程幫助大家學(xué)習(xí)2016-09-09