none
鼠标靠近一个主题就在主题下弹出相应的子主题怎么做??? RRS feed

答案

  • 给你举个简单的例子
    <%@ Page Language="C#" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
      <title></title>
      <script type="text/javascript">
        function ShowData(obj) {
          document.getElementById(obj.id + "_c").style.display = "";
        }
        function HideData(obj) {
          document.getElementById(obj.id + "_c").style.display = "none";
        }
      </script>
    </head>
    <body>
      <form id="form1" runat="server">
      <div>
        <div id="p1" onmouseover="ShowData(this)" onmouseout="HideData(this)">主题</div>
        <div id="p1_c" style="border: 1px solid red;display:none">子主题内容</div>
      </div>
      </form>
    </body>
    </html>
    
    当然,取数据的方法换成数据库也是一样的。
    采用ajax也是可以取到子主题内容的
    【孟子E章】
    2009年10月6日 11:16
    版主

全部回复

  • 在mouseover事件里,动态显示或者隐藏子主题内容
    【孟子E章】
    2009年10月5日 6:03
    版主
  • Windows Forms, Web Forms, WPF还是Silvelight程序?

    The following is signature, not part of post
    Please mark the post answered your question as the answer, and mark other helpful posts as helpful.
    Visual C++ MVP
    2009年10月5日 17:44
  • C#语言中,就是最网站的那种!
    2009年10月6日 0:56
  • 你可不可以讲具体点,我不是太熟!
    2009年10月6日 0:57
  • 楼主,你好

    一般网站的这种效果采用javascript中的onmouseover事件处理,详细请参考下面的文章。

    http://www.w3pop.com/learn/view/doc/jsref_onmouseover/

    上面说的是第一步,接下来显示子主题一般是通过div+content这样的方式做的。
    如果你需要动态获取子主题的内容,就要用到Ajax了。
    关于Ajax可以到下面网站。
    http://www.asp.net/learn/ajax/
    Microsoft Online Community Support
    2009年10月6日 1:45
  • 你好!
         可以使用MouseHover事件,这个事件在鼠标悬停的时候触发!你在这个事件里显示子项就可以了!
    周雪峰
    2009年10月6日 2:21
  • 给你举个简单的例子
    <%@ Page Language="C#" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
      <title></title>
      <script type="text/javascript">
        function ShowData(obj) {
          document.getElementById(obj.id + "_c").style.display = "";
        }
        function HideData(obj) {
          document.getElementById(obj.id + "_c").style.display = "none";
        }
      </script>
    </head>
    <body>
      <form id="form1" runat="server">
      <div>
        <div id="p1" onmouseover="ShowData(this)" onmouseout="HideData(this)">主题</div>
        <div id="p1_c" style="border: 1px solid red;display:none">子主题内容</div>
      </div>
      </form>
    </body>
    </html>
    
    当然,取数据的方法换成数据库也是一样的。
    采用ajax也是可以取到子主题内容的
    【孟子E章】
    2009年10月6日 11:16
    版主
  • 谢谢明白了!
    2009年10月7日 1:36