Twitter通知阿贾克斯吧，他们是怎么做到的？

我试图让那个很酷，ajax滑动栏，微博有（它稍微透明，白色）。Twitter通知阿贾克斯吧，他们是怎么做到的？

我试着看着html/css，但它似乎动态地注入了各种DOM层。

有人知道他们是如何实现它吗？

我真的很想学习如何做到这一点。

2009-10-16 mrblah

工作，我肯定会建议得到Firefox的Firebug插件。您可以轻松浏览DOM，检查CSS属性等。 – 2009-10-16 20:01:49

在这里检查，这正是作为一个jQuery插件：[jBar jQuery通知插件]（http://tympanus.net/codrops/2009/10/29/jbar-a-jquery-notification-plugin/）它很好地配置。 – cssmaniac 2009-10-29 02:24:37

运行这段代码在Firebug或上的document.ready（）

$("<div id='notification'>Notification text here</div>").css({ 
position:"fixed", 
top:"0px", 
left:"0px", 
height:"20px", 
width:"100%", 
backgroundColor:"#cccccc", 
color:"blue", 
padding:"5px", 
fontWeight:"bold", 
textAlign:"center", 
opacity:"0.5" 
}) 
.appendTo("body");

，你应该有一个即时通知栏...

如果您熟悉使用jQuery（我假设你是，因为这个问题被标记与jQuery），你可以调整CSS和HTML值，以满足您的需求...

有它滑下你可以这样做：

$("<div id='notification'>Notification text here</div>").css({ 
position:"fixed", 
top:"0px", 
left:"0px", 
height:"20px", 
width:"100%", 
backgroundColor:"#cccccc", 
color:"blue", 
padding:"5px", 
fontWeight:"bold", 
textAlign:"center", 
display:"none", //<-- notice this new value 
opacity:"0.5" 
}) 
.appendTo("body"); 
$("#notification").slideDown("slow"); //<-- this is the animation code

免责声明：只是一个快速的东西我刮起了，也不会感到惊讶，如果如果你想看看DOM和样式集是它没有在IE

来源

2009-10-17 01:52:40 ekhaled

Twitter通知阿贾克斯吧，他们是怎么做到的？

回答

相关问题