Maison  >  Article  >  interface Web  >  js制作的鼠标悬浮时产生的下拉框效果_jquery

js制作的鼠标悬浮时产生的下拉框效果_jquery

WBOY
WBOYoriginal
2016-05-16 17:48:451190parcourir

先给大家补补课,讲个简单的例子:

复制代码 代码如下:




jq=jQuery.noConflict();
jq=(document).ready(function(){
jq("a").mouseover(function(){
jq("a").css("color","#c00″);
});
jq("a').mouseout(function(){
jq("a").css("color","#000000″);
});


鼠标放在上面看看会发生什么


jq=jQuery.noConflict();
这是定义一个js的jquery库名;
jq(document).ready(function(){
/*这是一个关于document对象的函数里面是函数内容*/
});
jq("a").mouseover()function(){
/*这是定义事件mouseover的内容*/
}。
在看一个实际例子;点击时隐藏文本:
复制代码 代码如下:




div.abc {
background: #e5eec;
padding: 7px;
margin: 0px;
border: solid 1px #c00; }







这段文字在点击hideme时隐藏

这段文字同样也会隐藏。




功课差不多了,我们言归正传回到主题下拉框才是王道。
复制代码 代码如下:


blogs: www.jb51.net–>

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn