我将向您展示如何向您的网站添加一个非常酷的Twitter风格的登录窗口。 这很简单,只需遵循以下三个步骤:
- 在您的JavaScript include中输入以下jQuery代码
- 在下面输入HTML代码以创建表单和登录按钮
- 编辑CSS文件,以获取您想要的网站外观
jQuery(document).ready(function($) {
$(".signin").click(function(e) {
e.preventDefault();
$("fieldset#signin_menu").toggle();
$(".signin").toggleClass("menu-open");
});
$("fieldset#signin_menu").mouseup(function() {
return false
});
$(document).mouseup(function(e) {
if($(e.target).parent("a.signin").length==0) {
$(".signin").removeClass("menu-open");
$("fieldset#signin_menu").hide();
}
});
});
在您的html中输入以下代码:
这是CSS的示例: FRONT.CSS
对此有任何疑问,请随时与我联系 !
From: https://www.sitepoint.com/jquery-twitter-style-login-window/