Results 1 to 6 of 6

Thread: Sexy non-intrusive Message/Notification box...

  1. #1
    Sencha User
    Join Date
    Mar 2008
    Location
    Marietta, GA
    Posts
    93

    Cool Sexy non-intrusive Message/Notification box...

    I have searched for the best notification box to alert users to success / failure / new email / messages / etc that disappears without user interaction, but I can only come up with this one which is pretty common in extjs (below). Does anyone have a better box - I have problems with knowing how to get this one to show up in the bottom right, instead of the top; it's not always "on top" of everything else; sometimes it moves the whole web page, but if I do a postion:absolute it loses it's animation; the one from the QwikiDesktop app is solid, but I'm not smart enough to figure out how to "strip" it.

    Thanks!

    Deegan

    This is the best one I've come up with (from ext.messagebox):
    Code:
    var msgCt;
    
        function createBox(t, s){
            return ['<div class="msg" style="position:absolute;z-index:99;">',
                    '<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, 't-t');
                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('t').pause(1).ghost("t", {remove:true});
            },
    
        };

  2. #2
    Sencha User chalu's Avatar
    Join Date
    Feb 2008
    Location
    Benin City, Nigeria
    Posts
    480

    Question

    Have you taken a look at this

  3. #3
    Sencha User
    Join Date
    Mar 2008
    Location
    Marietta, GA
    Posts
    93

    Default Nice suggestion...

    But as indicated in that thread, it's not "clean" when it scrolls up in FF. Curious. It's pretty much exactly what I'd want to have if it didn't "stutter" while scrolling.

  4. #4
    Sencha User
    Join Date
    Mar 2008
    Location
    Marietta, GA
    Posts
    93

    Question

    I could be happy with the default messagebox if I could just figure out how to make it on TOP of everything else (z-index). I've tried monkeying with the outer DIV adding position:absolute and z-index:99, but that removes my FX.

    Anybody have any ideas?

    JD

  5. #5
    Sencha User
    Join Date
    Mar 2008
    Location
    Marietta, GA
    Posts
    93

    Cool Ext.ux.Notification

    Having done more research, this is what I'm looking for:

    Ext.ux.Notification

    I've tried some forum and website searches but can't seem to find this. Any ideas?!?

  6. #6
    Sencha User
    Join Date
    Mar 2008
    Location
    Marietta, GA
    Posts
    93

    Default Chalu

    Chalu was right on the money! It just took me several more hours of research to come around to realizing it. (At least I learned something)

    Thanks.

    J

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •