デフォルトの 9 正方形グリッドの画像配置効果。マウスを画像の上に置くと、半透明のマスク効果が画像の上からスライドします。
いくつかのテキスト紹介が同時に表示されます
使用方法:
1. Web ページに head 内の CSS スタイルを導入します
2. コード部分を Web ページの本文の最後にコピーします
(js と画像は絶対パスを使用するため、変更は推奨されません)
$(関数(){
$('.sgw_img dt').hover(function(){
$(this).children('.box').stop(true,true).delay(100).animate({'top':0,opacity:0.8},300);
},function(){
$(this).children('.box').stop(true,true).animate({'top':-482,opacity:0},200);
})
$('.sgw_img dd').hover(function(){
$(this).children('.box').stop(true,true).delay(100).animate({'top':0,opacity:0.8},300);
},function(){
$(this).children('.box').stop(true,true).animate({'top':-382,opacity:0},200);
})
})
上記はこの記事で共有されたすべての内容です。皆さんに気に入っていただければ幸いです。