how to bring a popup with a single line message like in yahoo messenger?

[jakri]

Hello

I think everybody is familiar with yahoo messenger.. Suppose that a new mail is received in the inbox of the user when he has logged in the yahoo msngr.Then a small pop up with a message "You have one new mail" comes from from just above the status bar .

Is there any javascript for such a pop up..????
If anybody has good ideas please share...

Thanks
Jakri

[jscheuer1]

I've never seen the type of pop-up you are describing but, I just whipped up a script to do what I think you are describing. Before I go and setup configurable variables so that someone using this script can easily customize it, try it out. If it suits you and you can see how to configure it, use it 'as is' because that will use less overhead. If as I imagine, it appears difficult to configure, let me know what parts you would like easily customizable. Or if I've completely missed the mark of the type of pop-up you are generally going for, tell me more precisely what you had in mind. Also, note any bugs you may encounter (I've tested out fairly thoroughly but, you never know). It can go anywhere in the body of your page:

<script type="text/javascript">

/*Lower Left Pop-up script
/ © John Davenport Scheuer (jscheuer1)
/ as first seen in:
/ http://www.dynamicdrive.com/forums
/ This credit must reamin for legal use
*/

var delay, hidePopper=null;
document.write('<div id="popper" style="text-align:center;padding:0 5px;background-color:white;color:black;visibility:invisible;position:absolute;z-index:-1;left:10px;"><span></span></div>')
function popIt(text){
hidePopper=function(){
clearTimeout(delay)
popObj.style.visibility='hidden'
popObj.style.zIndex='-1'
hidePopper=null;
}
var docW, docEls=document.getElementsByTagName? document.getElementsByTagName('*') : document.all
for (var i_tem = 0; i_tem < docEls.length-1; i_tem++)
docW=Math.max(docEls[i_tem].offsetWidth,docEls[i_tem+1].offsetWidth)
var popObj=document.getElementById? document.getElementById('popper') : document.all['popper'];
popObj.firstChild.innerHTML=text
var baseH=window.innerHeight? window.innerHeight : document.documentElement.offsetHeight
var baseW=window.innerWidth? window.innerWidth : document.documentElement.offsetWidth
var hOff=docW>baseW? 41 : 25
popObj.style.top=baseH+Math.max(document.documentElement.scrollTop,document.body.scrollTop)-hOff+'px';
popObj.style.width=popObj.firstChild.offsetWidth+12+'px'
popObj.style.visibility="visible"
popObj.style.zIndex=100
popObj.style.border='1px solid red'
delay=setTimeout("if(hidePopper!==null)hidePopper();",4000)
}
</script>
<!-- Example Trigger -->
<br><input type="button" value="Launch Pop-up" onclick="popIt('You\'ve just activated this pop up!')">