jQuery鼠标滑过图片显示遮罩背景层代码

个人觉得比较好看的一款jQuery鼠标滑过图片显示遮罩背景层代码特效，基于jQuery和CSS3制作。

JS代码：
<scriptsrc="http://libs.useso.com/js/jquery/2.1.1/jquery.min.js"type="text/javascript"></script>
<script>window.jQuery||document.write('<scriptsrc="js/jquery-2.1.1.min.js"><\/script>')</script>
<scriptsrc="js/modernizr.js"></script>
<script>
$(document).ready(function(){
if(Modernizr.touch){
//showthecloseoverlaybutton
$(".close-overlay").removeClass("hidden");
//handletheaddingofhoverclasswhenclicked
$(".img").click(function(e){
if(!$(this).hasClass("hover")){
$(this).addClass("hover");
}
});
//handletheclosingoftheoverlay
$(".close-overlay").click(function(e){
e.preventDefault();
e.stopPropagation();
if($(this).closest(".img").hasClass("hover")){
$(this).closest(".img").removeClass("hover");
}
});
}else{
//handlethemouseenterfunctionality
$(".img").mouseenter(function(){
$(this).addClass("hover");
})
//handlethemouseleavefunctionality
.mouseleave(function(){
$(this).removeClass("hover");
});
}
});
</script>



下载

2023-11-23 01:00 上传

点击文件名下载附件