jQuery的滑鼠懸停圖片邊框動畫特效
js程式碼
<script> $(function(){ // 邊框效果--移入 function biankuang(){ $('.biankuang_1').stop(true).animate({ height:'305px' },300) $('.biankuang_2').stop(true).delay(300).animate({ width:'360px' },300) $('.biankuang_3').stop(true).animate({ height:'305px' },300) $('.biankuang_4').stop(true).delay(300).animate({ width:'360px' },300) } // 邊框效果--移出 function biankuang1(){ $('.biankuang_1').stop(true).delay(100).animate({ height:'0px' },100) $('.biankuang_2').stop(true).animate({ width:'0px' },100) $('.biankuang_3').stop(true).delay(100).animate({ height:'0px' },100) $('.biankuang_4').stop(true).animate({ width:'0px' },100) } // 觸發 $('.cn_gobuy').hover( function () { $('.text_gobuy').addClass('text_gobuy_show'); $('.search_y').animate({left:'150',opacity:1},300); biankuang(); }, function () { $('.text_gobuy').removeClass('text_gobuy_show'); $('.search_y').animate({left:'100',opacity:0},300); biankuang1(); } ); }) </script>
jQuery滑鼠懸停圖片邊框動畫特效是一款滑鼠移動商品圖片的時候動畫顯示紅色邊框的動畫代碼。
本站所有資源皆由網友貢獻或各大下載網站轉載。請自行檢查軟體的完整性!本站所有資源僅供學習參考。請不要將它們用於商業目的。否則,一切後果都由您負責!如有侵權,請聯絡我們刪除。聯絡方式:admin@php.cn
相關文章
16 May 2016
這篇文章主要介紹了js實現動畫特效的文字連結滑鼠懸停提示的方法,實例分析了javascript操作css的技巧,具有一定參考借鑒價值,需要的朋友可以參考下
16 May 2016
本文將為大家收集10個超讚的jQuery圖片滑桿動畫,都是小編精挑細選而來,希望這些現成的jQuery插件將為你節省很多開發時間。
18 Jan 2017
這是一款以jquery為基礎的超逼真下雪場景特效。此特效使用jquery程式碼來動態外掛程式html5 canvas元素,然後在canvas中製作下雪特效。
18 Jan 2017
這是一款使用jQuery和CSS3來製作的酷炫漢堡包變形動畫特效。此特效透過jQuery來附加按鈕事件,並透過CSS3 transform和animation來製作動畫特效。
23 May 2023
隨著網路的普及,打字特效的應用越來越廣泛,jquery打字特效也成為了許多網站開發人員的首選。然而,在實現這種特效的過程中,細節問題常常會影響使用者體驗,例如打字特效的回刪問題。本文將介紹如何利用jquery打字特效停止回刪,提升使用者的瀏覽體驗。 jquery打字特效的實作可以使用現成的插件,如typed.js和jQuery.Typewriter等。這些插件都是基於jquery的
16 May 2016
jquery提示效果很多,本文也提供一個超漂亮的仿騰訊彈出層效果,熱愛特效的你可千萬不要錯過了啊,希望本文提供的案例對你學習jquery特效有所幫助
Hot tools Tags
Hot Tools
jQuery2019情人節表白放煙火動畫特效
一款抖音上很火紅的jQuery情人節表白放煙火動畫特效,適合程式設計師、科技宅用來向心愛的女孩告白,無論你選擇願意或不願意,到最後都得同意。
layui響應式動畫登入介面模板
layui響應式動畫登入介面模板
520情人節表白網頁動畫特效
jQuery情人節表白動畫、520表白背景動畫
酷炫的系統登入頁
酷炫的系統登入頁
HTML5卡音樂播放器-CASSETTE PLAYER
HTML5卡音樂播放器-CASSETTE PLAYER