Ext.example msg

[genius551v]

Hi guys,

I liked very much the MSG of the examples, and i wanted to have something like MSN-MESENGER or YAHOO-MESENGER, i talk about something like that: (attachment1)

ok, i have this but dont work full, in FF the pos (x,y) is diferent in IE:


Ext.message = function(){
var msgCt;

function createBox(t, s){
return ['<div class="msg">',
'<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>',
'<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc"><h3>', t, '</h3>', s, '</div></div></div>',
'<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>',
'</div>'].join('');
}

return {
msg : function(title, format){
if(!msgCt){
msgCt = Ext.DomHelper.insertFirst(document.body, {id:'msg-div'}, true);
}
msgCt.alignTo(document, 'br-br', [-7,-67]); /*<-- pos in bottom-right corner*/
var s = String.format.apply(String, Array.prototype.slice.call(arguments, 1));
var m = Ext.DomHelper.append(msgCt, {html:createBox(title, s)}, true);
m.slideIn('b').pause(1).ghost("b", {remove:true}); /*<--move from bottom*/
}
}
}();


ok, see like that: (attachments2,3)

any suggest? any idea about style to look like msn-mesenger??

Tnks

[genius551v]

no one??? :-/

[DustinW]

I figured this out if you have not already. The yoffset needs to be set dynamically equal to the height of the msg div. I did this by editing the msg: function.


msg : function(title, format, sec){
if(!msgCt){
msgCt = Ext.DomHelper.insertFirst(document.body, {id:'msg-div'}, true);
}

var s = String.format.apply(String, Array.prototype.slice.call(arguments, 1));
var m = Ext.DomHelper.append(msgCt, {html:createBox(title, s)}, true);
// Added The following code to get the <div> height
var yoffset = document.getElementById("msg").style.height;
// Then added that value to the yoffset position in alignTo
msgCt.alignTo(document, 'br-br', [0,yoffset]);
m.slideIn('t').pause(sec).ghost("t", {remove:true});
},

You also have to add an id to the msg div:


function createBox(t, s){
// Added msg id
return ['<div class="msg" id="msg" name="msg">',
'<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>',
'<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc"><h3>', t, '</h3>', s, '</div></div></div>',
'<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>',
'</div>'].join('');
}

[yannah]

hi guys...

can anyone show me how to make the ext.example.msg to appear at the bottom (any part) of the screen?

tnx much for the help

[tryanDLS]

Please don't resurrect old threads from previous versions to ask a question. Start a new thread in the correct forum.