2013-06-27 23:44
浏览 105


I am making a fairly complex front page that in essence is a threaded discussion forum. At present all is functional but I want to replace the links after the message that allow one to delete, reply, archive and other functions. At present the links are all text. I can use small images and make them look nicer. However on a busy front page with lots of messages and threads a whole bunch of images will make the whole page look overwhelming.

The way it works for now is each iteration of the call to function that reads a message from db will start a ul and this allows me to nicely pad the child messages and the depth.

Here is what I want to do - create a small popup menu that will show up when someone hovers over the actual message. Because my current way of showing threaded messages using ul and li when I tried to use jqueryui menu widget it wrecks the formatting.

Sorry about all the rambling but is there a way to show a slim line of links above a message when someone hovers over it and each message in the page will obviously need to have different links [to allow blah.php?messageid=...].

I have been looking at jqueryui and learnt it to a tiny extent and still reading the tutorial. Is there a way of doing what I asked above!


图片转代码服务由CSDN问答提供 功能建议

我正在制作一个相当复杂的首页,实质上是一个线索讨论论坛。 目前所有功能都有用,但我希望在允许删除,回复,存档和其他功能的消息之后替换链接。 目前链接都是文本。 我可以使用小图像,使它们看起来更好。 然而,在繁忙的首页上有大量的消息和线程,一大堆图像将使整个页面看起来压倒一切。

它现在的工作方式是每次迭代调用函数调用从db读取一条消息都会启动一个ul,这样我就可以很好地填充子消息和深度。 / p>

这是我想要做的 - 创建一个小的弹出菜单,当有人将鼠标悬停在实际消息上时,该菜单会显示出来。 因为当我尝试使用jqueryui菜单小部件时,我当前使用ul和li显示线程消息的方式会破坏格式化。

对于所有漫无目的而言有用但有没有办法显示苗条 当有人将鼠标悬停在消息上方时,消息上方的链接显然需要有不同的链接[允许blah.php?messageid = ...]。

我 一直在看jqueryui并在很小程度上学习它并仍在阅读教程。 有没有办法做我上面提到的问题!


  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

2条回答 默认 最新

  • dousi1994 2013-06-28 00:13

    a simple way to do this is as follows:

    given markup

    <div class="menu-pop">
        <div class="menu-label">Menu Label</div>
        <div class="menu-items">
            <div class="menu-item">menu choice</div>
            <div class="menu-item">menu choice</div>
            <div class="menu-item">menu choice</div>
            <div class="menu-item">menu choice</div>
            <div class="menu-item">menu choice</div>

    provide css:

    .menu-pop {
        position: relative;
    .menu-pop .menu-items {
        display: none;
        position: absolute;
    .menu-pop.dropped .menu-items {

    and a simple jquery function:

            function() { $(this).addClass("dropped"); }, 
            function() { $(this).removeClass("dropped" ); }

    then ... well ... make it pretty.

    see the jsfiddle here:

    解决 无用
    打赏 举报

相关推荐 更多相似问题