Question

我需要一些css和语法帮助。热烈欢迎您的帮助。

当我将鼠标移到图像上时，我想插入一个包含一些skypelinks的列表，并且表现得像侧边栏菜单。这是我试图操纵的html代码：

<a href="?USER=name">
    <img src="../../name.jpg?format=raw" title="full name - skypename">
</a>

通过在图像上移动鼠标并且图像标题为skypename，两个链接应该向右淡出（float：right;？）


    $("img[title$=\"skypename\"]").mouseover(function(){
      $("<ul><li><a href=\"callto://skypename\">Call</a></li><li><a href=\"mailto://skypename\">Chat</a></li></ul></li></ul>");
    });

我的目标是让html代码看起来像：

<ul>
  <li>
    <a href="?USER=name">
      <img src="../../name.jpg?format=raw" title="full name - skypename" alt="Klick me!">
    </a>
    <ul>
      <li><a href="callto://skypename">Call</a></li>
      <li><a href="mailto://skypename">Chat</a></li>
    </ul>
   </li>
</ul>

我创造了一个小提琴http://jsfiddle.net/erhDJ/2/，我试过了。像弹出菜单一样工作。在我的情况下，我上面提到的第一个代码将取代Klick me！。通过将鼠标移到它上面，两个链接应该向右淡出。

我的问题：如何用第二个代码包围第一个代码，使其看起来像第三个代码片段？您是否看到了创建此类弹出菜单的更简单选项？

谢谢。

Answer 1

我不太确定你真正想要什么，但我可以给你一个用一些CSS和jQuery动画菜单的例子。

Sliding, animated menu when hovering link

这有用吗？

创建弹出/侧边栏菜单时出现问题

1 个答案: