使用javascript缓慢地以“下拉”方式显示隐藏的div

时间:2011-11-12 19:07:06

标签: javascript html css drop-down-menu

我有一个包含类似内容的小块:Login | Register

当用户点击Login时,该块会在下方展开,并显示一个供用户登录的表单。再次点击Login会再次隐藏该表单。

当用户点击Register(但使用不同的表单)时也是如此。如果在另一个表单可见时单击Login or Register,则应使新选择的表单可见,另一个表单应该消失。

我想做的不仅仅是让表格显得凭空而来。我试图通过非常小的延迟来“下拉”。同样,它应该在重新切换表单时“汇总”。

如果这很简单,有人可以提供一些代码吗?如果它涉及更多一点,也许一个解释或链接可以帮助我弄清楚自己会非常有帮助。

1 个答案:

答案 0 :(得分:3)

使用JQuery等框架为您简化此操作。它简化并规范了JavaScript的所有不良部分,因此编写JS可以再次变得有趣。除非你是一个大师并且理解“JavaScript”和“JScript”之间的所有设计缺陷和不一致,否则框架就是可行的方法。 JQuery只是极少数之一。如果您不喜欢JQuery的语法,可以研究MootoolsDojoYUI

$('#login').click(function(){
    $('#loginForm').slideToggle('fast');
});

http://api.jquery.com/slideToggle/

演示:http://jsfiddle.net/vNeXq/