ext:qtip and delay before disappearing

  1. #1

    ext:qtip and delay before disappearing

    Hello.
    Is there any way to have a tooltip showing while the mouse is over an element, and not disapperaing before the mouse leave?
    Actually it disappears after a while and it bothers me :(
    Thx in advance.
  2. #2

    RE: ext:qtip and delay before disappearing

    I met the same problem. have any solution or workaround?
    thanks.
  3. #3

    RE: ext:qtip and delay before disappearing

    Hi,

    Does the following example help solve the problem, see*https://examples1.ext.net/#/Miscella...Tips/Overview/


    You should be able to set DismissDelay="0" on the <ext:ToolTip>, see*http://extjs.com/deploy/dev/docs/?cl...r=dismissDelay


    Hope this helps.


    Geoffrey McGill
    Founder
  4. #4

    RE: ext:qtip and delay before disappearing

    Forgot this little detail, I'm using v0.6, and I'm trying to add Tooltips to DataView items.
    And it doesn't looks like I can add <ext:Tooltip /> in my template.

    That's why I was using the ext:qtip attribute.
  5. #5

    RE: ext:qtip and delay before disappearing

    Hi Rod,

    try to add*


    ext:hide="false"




  6. #6

    RE: ext:qtip and delay before disappearing

    Works like a charm, big thx Vlad :)
  7. #7

    RE: ext:qtip and delay before disappearing

    In fact, it doesn't, sry -_-
    I was so happy that it didnt disappear I didn't try to move my mouse.
    The tooltip doesn't disappear when the mouse leaves the underlying element.
    In fact it acts like a closeable tooltip, but without the cross to close it.
    Any clue how to make the tooltip disappear when the cursor leaves the element?
  8. #8

    Little Ext.QuickTip override

    Quote Originally Posted by Rod View Post
    In fact, it doesn't, sry -_-
    I was so happy that it didnt disappear I didn't try to move my mouse.
    The tooltip doesn't disappear when the mouse leaves the underlying element.
    In fact it acts like a closeable tooltip, but without the cross to close it.
    Any clue how to make the tooltip disappear when the cursor leaves the element?
    My solution is to override the Ext.QuickTip class.
    I'm using ext-3.4.0.
    I added dismissDelay property (at 0 like default value), I added the tag: dismissDelay : "qdmDelay" so I'm able to use it in html in the same as the other
    and I override the onTargetOver function with a little modify, I'had added the assignement of the new tag value in the activeTarget (dismissDelay: et.getAttribute(cfg.dismissDelay, ns))

    Maybe isn't the better way, there are much more OOP way to write it, but it works fine :)

    Ext.override(Ext.QuickTip, {
    	dismissDelay: 0,
    	tagConfig : {
            namespace : "ext",
            attribute : "qtip",
            width : "qwidth",
            target : "target",
            title : "qtitle",
            hide : "hide",
            dismissDelay : "qdmDelay",
            cls : "qclass",
            align : "qalign",
            anchor : "anchor"
        },
        onTargetOver: function(e){
            if(this.disabled){
                return;
            }
            this.targetXY = e.getXY();
            var t = e.getTarget();
            if(!t || t.nodeType !== 1 || t == document || t == document.body){
                return;
            }
            if(this.activeTarget && ((t == this.activeTarget.el) || Ext.fly(this.activeTarget.el).contains(t))){
                this.clearTimer('hide');
                this.show();
                return;
            }
            if(t && this.targets[t.id]){
                this.activeTarget = this.targets[t.id];
                this.activeTarget.el = t;
                this.anchor = this.activeTarget.anchor;
                if(this.anchor){
                    this.anchorTarget = t;
                }
                this.delayShow();
                return;
            }
            var ttp, et = Ext.fly(t), cfg = this.tagConfig, ns = cfg.namespace;
            if(ttp = this.getTipCfg(e)){
                var autoHide = et.getAttribute(cfg.hide, ns);
                this.activeTarget = {
                    el: t,
                    text: ttp,
                    width: et.getAttribute(cfg.width, ns),
                    autoHide: autoHide != "user" && autoHide !== 'false',
                    title: et.getAttribute(cfg.title, ns),
                    cls: et.getAttribute(cfg.cls, ns),
                    align: et.getAttribute(cfg.align, ns),
                    dismissDelay: et.getAttribute(cfg.dismissDelay, ns)
                };
                this.anchor = et.getAttribute(cfg.anchor, ns);
                if(this.anchor){
                    this.anchorTarget = t;
                }
                this.delayShow();
            }
        }
    });
    Last edited by Baidaly; Nov 13, 2013 at 4:22 AM. Reason: Don't forget to use CODE tag
  9. #9
    Thank you very much @aurox for your solution.

Similar Threads

  1. Replies: 0
    Last Post: Jul 06, 2012, 9:16 PM
  2. [CLOSED] qtip leaks out
    By deejayns in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Oct 14, 2011, 2:46 PM
  3. QTip on cell not having any content
    By mansi752 in forum 1.x Help
    Replies: 5
    Last Post: Dec 21, 2010, 9:40 AM
  4. How to add ext:qtip to image?
    By dbassett74 in forum 1.x Help
    Replies: 4
    Last Post: May 11, 2009, 5:26 PM
  5. [CLOSED] Bug in ext:qtip in asp image button
    By speedstepmem2 in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Feb 20, 2009, 2:54 AM

Posting Permissions