Question

想知道如何使用以下代码段实现此目的：每当我将鼠标悬停在Test上时，我想在onmouseover上显示一些下拉列表

<div id="appLinks">
    <ul id="appLinks_list" class="nav">
        <span id="appLink_csrname" class="ui-state-default csrname">Test</span>
            <li id="appLink_about" rtlOrder="3"><a title="tooltip"   href="javascript:openAboutDialog();">&nbsp; About</a></li>
        </span>
    </ul>
</div>

Answer 1

仅供参考，你不需要任何javascript来做到这一点。

ul li { display:none; }
ul:hover li { display:block; }

Answer 2

试试这个：

<div id="outer">
  Outer
  <div id="inner">
    Inner
  </div>
</div>
<div id="other">
  Trigger the handler
 </div>
<div id="log"></div>

Jquery：

 $( "#outer" ).mouseover(function() {
 $( "#log" ).append( "<div>Handler for .mouseover() called.</div>" );
 });

不要忘记我们的包含Jquery 例：

Answer 3

<强> HTML

<ul class="my_list">
      <span>text</span>
               <li>hi</li>
               <li>i</li>
               <li>am</li>
               <li>archie</li>
               <li>abhi</li>
             </ul>

<强>的CSS：`

.my_list li{
            display: none;
              }
        .my_list:hover  li{
          display: block;
        }

<强>的javascript

 <script>
     $(document).ready(function(){
      $(".my_list").mouseleave(function(){
          $(".my_list li").css("display","none");
        });
        $(".my_list").mouseover(function(){
          $(".my_list li").css("display","block");
        });
     });
     </script>

MouseOver上的DropDown

3 个答案: