Question

我是ASP.NET的初学者，需要知道如何在以下网站中创建悬停效果： -

http://www.viking.com/Chairs/Chairs.asp

网页的右上角有这个链接“购物车”...当你将鼠标移到它上面时，会显示一个文本框..

如何创建该效果？

我只需要一个像我搜索的内容的想法？ ..我需要在我的网页中包含所有代码吗？

请帮帮忙？感谢

Answer 1

它看起来更像是关于jquery而不是asp.net。从id（foo）中给出您希望框出现的元素，并使用要在onmouseover（bar）上显示的数据创建另一个隐藏的div。

对于要使框出现的元素，使用JQuery添加鼠标悬停事件，例如：

$(document).ready(function() {
  $("#foo").live("mouseover", function () {
     $("#bar").slideDown("fast");
  });
  $("#foo").live("mouseout", function () {
     $("#bar").hide();
  });
});

<div id="foo">MOUSOVER ME FOR BOX</div>
<div id="bar" style="visibility:hidden;">HIDDEN CONTENT</div>

这应该为你做一个基本的滑动效果，并且应该在鼠标移出时隐藏它。查看http://api.jquery.com/以更好地了解正在发生的事情，您可以使用JQuery。

编辑 - 您需要在页面上包含JQuery js文件，请参阅此处http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery

Answer 2

看起来它是用jQuery和Hover mouseevent完成的。所以你可能想看一下javascript，jQuery和CSS，它并不是特定于ASP.NET。

Answer 3

看一下jquery的动画效果，滑动效果。我认为您的示例使用悬停鼠标事件来启动http://api.jquery.com/slideDown/效果。

关于悬停效果的ASP.NET初学者问题

3 个答案: