jQuery 想要实现鼠标放上显示并可选择,鼠标离开隐藏。

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery 想要实现鼠标放上显示并可选择,鼠标离开隐藏。相关的知识,希望对你有一定的参考价值。

这个是现在的效果,鼠标放上后显示,并可以选中,不选就隐藏不了。想要效果:鼠标放上显示,并可以选择,不选中或者离开,隐藏。
function Search()
$(function()
$('.allspan').mouseover(function()
$('#pSearchClass').show();
);
$('#pSearchClass').find('li').click(function()
$('#searchClassName').html($(this).children('a').text());
$('#searchClassId').val($(this).children('a').attr('rev'));
$('#pSearchClass').hide();
return false;
);
);
;
修改后的代码:
function Search()
$(function()
$('.allspan').mouseover(function()
$('#pSearchClass').show();
);
$('.allspan').mouseout(function()
$('#pSearchClass').hide();
);
$('#pSearchClass').find('li').click(function()
$('#searchClassName').html($(this).children('a').text());
$('#searchClassId').val($(this).children('a').attr('rev'));
$('#pSearchClass').hide();
return false;
);
);
;
只出现了鼠标放上显示,和离开隐藏,但是不能选中了。
求大神帮忙修改,分不多了

参考技术A http://blog.csdn.net/eadio/article/details/23947281
看下这个博文,你有没有吧下拉装在父元素allspan里面,要装这里就不会了,还有感觉hover比较好用。。。。

鼠标放上超链接显示背景效果

鼠标放上超链接显示背景效果:

<html>
<head>
<style type="text/css">
a.one:link {color: #ff0000}
a.one:visited {color: #0000ff}
a.one:hover {color: #ffcc00}

a.two:link {color: #ff0000}
a.two:visited {color: #0000ff}
a.two:hover {font-size: 150%}

a.three:link {color: #ff0000}
a.three:visited {color: #0000ff}
a.three:hover {background: #66ff66}

a.four:link {color: #ff0000}
a.four:visited {color: #0000ff}
a.four:hover {font-family: monospace}

a.five:link {color: #ff0000; text-decoration: none}
a.five:visited {color: #0000ff; text-decoration: none}
a.five:hover {text-decoration: underline}
</style>
</head>

<body>
<p>请把鼠标移动到这些链接上,以查看效果:</p>

<p><b><a class="one" href="http://jinmengqiang.cn" target="_blank">这个链接改变颜色</a></b></p>
<p><b><a class="two" href=" http://jinmengqiang.cn" target="_blank">这个链接改变字体大小</a></b></p>
<p><b><a class="three" href=" http://jinmengqiang.cn" target="_blank">这个链接改变背景颜色</a></b></p>
<p><b><a class="four" href=" http://jinmengqiang.cn" target="_blank">这个链接改变字体系列</a></b></p>
<p><b><a class="five" href=" http://jinmengqiang.cn" target="_blank">这个链接改变文本装饰</a></b></p>
</body>

</html>

只需要在超链接CSS样式中添加以下代码即可:

a:link {color: #ff0000}
a:visited {color: #0000ff}
a:hover {background: #66ff66}

 

以上是关于jQuery 想要实现鼠标放上显示并可选择,鼠标离开隐藏。的主要内容,如果未能解决你的问题,请参考以下文章

jquery 鼠标移除 清除所有的事件

怎么用jQuery实现鼠标移入样式滑动显示

鼠标放上超链接显示背景效果

js+css鼠标移动图片放大

怎样让html滚动字幕初始状态为停止 ,打开网页不动, 鼠标放上开始动, 鼠标离开就停止

jQuery:在鼠标离开时停止音频