html - 设计一个 float 登录 问题

Question

任何人都可以指导我设计一个像 ups.com 这样的登录 div。只需转到 www.ups.com 并单击登录按钮，然后就会出现一个 float 的登录 div。如何生成这种类型的div。如果可能请帮助我。谢谢

Answer 1

你需要用 CSS 样式 position: absolute; 制作一个 div z-index:100。这会将 div 定位在所有内容的顶部 (z-index) 并且不会将其从其位置移动，使用 top, left 进行设置、底部 和右侧。这四个数字以像素为单位，并且是相对于 HTML Canvas 的。

要显示 float div，请将其 display CSS 设置为 display: none。然后，使用 JavaScript 或 jQuery，单击登录链接将显示弹出式 div，就像这样 (jQuery):

HTML

<a href="" id="login_link"><div id="login_form">    -- form contents --</div>

CSS

#login_form{    display: none;    position: absolute;    top: /* Whatever padding you need */;    bottom: /* Whatever padding you need */;    left: /* Whatever padding you need */;    right: /* Whatever padding you need */;}

jQuery

$("#login_link").click(function() {    $("#login_form").show()      // Can be .fadeIn() too});

希望对您有所帮助，

詹姆斯