jquery插件鼠标移上去当前列表显示图片的特效

最新推荐文章于 2021-02-19 13:40:44 发布

weixin_34049948

最新推荐文章于 2021-02-19 13:40:44 发布

阅读量262

点赞数

CC 4.0 BY-SA版权

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/u/1415286/blog/188711

本文介绍如何使用jQuery的扩展函数创建一个图片轮播插件，通过鼠标悬停来展示对应图片信息，简化了操作流程。示例代码演示了如何通过简单的jQuery方法实现动态图片展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

2019独角兽企业重金招聘Python工程师标准>>>

鼠标移上去时显示对应的图片信息，不过它是采用了jquery的扩展函数做的一个插件，使用起来就比之前的那个方便多了。

jquery代码：

$.fn.extend({     
   AdAdvance:function(){
	var listobj=this;
        var objs =$('dt',this);
	var view =objs.length-1;//parseInt( Math.random()*objs.length);
	objs.each(function(i){
	$(this).mouseover(function(){ $('dd',listobj).hide();$('.dropList-hover',listobj).attr("class",""); $(this).children("p").attr("class","dropList-hover");$(this).next().show()})
	if(i!=view)
	{
		$(this).next().hide();
	}
	else
	{
		$(this).next().show();
		$(this).children("p").attr("class","dropList-hover");
	}
	});
    }
});

调用方法：