Sto cercando di ottenere quella fredda barra scorrevole ajax che ha twitter (è leggermente trasparente, bianca).Notifica su Twitter ajax bar, come hanno fatto?
Ho provato a guardare l'html/css, ma sembra che si iniettino dinamicamente i vari livelli DOM.
Qualcuno sa come l'hanno implementato?
Voglio davvero imparare come farlo.
esegue questo codice in Firebug o 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");
e si dovrebbe avere una barra di notifica immediata ...
Se sei a conoscenza con jQuery (che suppongo che voi siate , perché la domanda è codificata con jQuery), è possibile modificare i valori CSS e HTML per soddisfare le vostre esigenze ...
di averlo scivolare verso il basso si dovrebbe fare questo:
$("<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
responsabilità: solo una cosa veloce ho scatenato, non sarà sorpreso se non ha funzionato in IE
Se si sta cercando di vedere ciò che il DOM e gli stili set sono, consiglio vivamente di ottenere il plug-in Firebug per Firefox. Puoi sfogliare facilmente il DOM, controllare gli attributi CSS, ecc. –
Controlla qui, è esattamente come un plugin jQuery: [jBar jQuery Notification Plugin] (http://tympanus.net/codrops/2009/10/29/jbar-a-jquery-notification-plugin/) È ben configurabile . – cssmaniac