这个网站是如何从顶部滑动其newsletter+的？

Question

试图弄清楚这个站点是如何让他们的newsletter+按钮滑下页面的：

http://thestoryoftelling.com/ (点击"newsletter+")

看起来#wrap元素的页面偏移量是57px，它的背景url在“滑动”进去后实际上变成了注册链接的背景。点击"newsletter+“调用一个"_gaq”函数，但这似乎更多的是为了跟踪。

我认为它是通过superfish激活的，但我不明白它是如何调用的，或者是从哪里调用的：

jQuery(document).ready(function($) { 
    $('#header .menu, .superfish').superfish({
        delay:       100,                               // 0.1 second delay on mouseout 
        animation:   {opacity:'show',height:'show'},    // fade-in and slide-down animation 
        dropShadows: false                              // disable drop shadows 
    });
});

有什么想法吗？可能是jquery的事情。

Answer 1

嗯，就我个人而言，我会做一些类似的事情，将彩色条作为页面上的第一个元素，并给它一个负的margin-top，这样只显示底部边缘。然后我可以设置style.marginTop='0'，如果我设置了合适的transition属性，那么它将像您显示的网站一样滑动。

Demonstration on JSFiddle