基于下拉选择的信息框

下面是我正在做的事情..我有一个下拉框，我想要一个浮动框来显示基于该项目的定义。基于下拉选择的信息框

例如，该列表包含，

项目1个项目2 项目3 项目4

用户悬停在项目2和简要描述将弹出。

有没有办法让我做到这一点？我不是在寻找整个代码，我只是想指出正确的方向。

谢谢你...

来源

2013-05-20 Kevin Davis

希望能帮助你完成任务。 =] – Supplement

谢谢我会给它一个镜头。 –

是的，如果它有效，请将我的答案标记为将来参考的正确答案。谢谢。 – Supplement

有很多不同的方法来完成这项任务。

纯CSS

<a>Hover over me!</a> 
<div>Stuff shown on hover</div> 

div { 
    display: none; 
} 

a:hover + div { 
    display: block; 
}

也有是jQuery的：

$("#yourElement").attr('title', 'This is the hover-over text');

有它的一个插件，以及jQuery的，如果你可能需要使用它了：

jQuery的工具提示插入。发现这里

http://jqueryui.com/tooltip/?rdfrom=http%3A%2F%2Fdocs.jquery.com%2Fmw%2Findex.php%3Ftitle%3DPlugins%2FTooltip%26redirect%3Dno

的javascript：

<div style="width: 80px; height: 20px; background-color: red;" 
     onmouseover="document.getElementById('div1').style.display = 'block';"> 
    <div id="div1" style="display: none;">Text</div> 
</div> 


onmouseout="document.getElementById('div1').style.display = 'none';"

是另一个jQuery选择是显示和隐藏：

$("#menu").hover(function(){ 
    $('.flyout').show(); 
},function(){ 
    $('.flyout').hide(); 
});

jQuery的鼠标悬停及移出：

http://jsfiddle.net/hGTPp/

来源

2013-05-20 14:07:17 Supplement

基于下拉选择的信息框

回答

相关问题