Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: Mouseover delay

  1. #1
    Sencha User
    Join Date
    Dec 2010
    Posts
    126
    Vote Rating
    0
      0  

    Default Mouseover delay

    I want an pop up to open only if the mouse been over a link for 500 ms. How do i do that? Right now it fires immediately..

  2. #2
    Sencha User friend's Avatar
    Join Date
    Apr 2011
    Posts
    895
    Vote Rating
    27
      0  

    Default

    If you're talking about ToolTips, you can set global options to affect all ToolTips:

    Code:
     Ext.QuickTips.init();
     Ext.apply(Ext.QuickTips.getQuickTip(), {showDelay: 500, dismissDelay: 5000});
    Note that you can set a 'dismissDelay: 0' if you want the user to manually dismiss the tooltip, via a mouse click.

  3. #3
    Sencha User
    Join Date
    Dec 2010
    Posts
    126
    Vote Rating
    0
      0  

    Default

    no not a tooltip, i want a window to pop up.

  4. #4
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,553
    Vote Rating
    1272
      0  

    Default

    Code:
    cmp.mon(el, {
        delay: 200, //in miliseconds
        mouseover: someFunc
    });
    If you look at the addListener method you will see the different options you can add in the object. You can use things like delegate that allow you to have one listener but for multiple targets in the el. I think delay is the one you want, either that or buffer.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  5. #5
    Sencha User
    Join Date
    Dec 2010
    Posts
    126
    Vote Rating
    0
      0  

    Default

    yup.. that's what i needed.. thanks..

  6. #6
    Sencha User
    Join Date
    Dec 2010
    Posts
    126
    Vote Rating
    0
      0  

    Default

    this doesn't seem to work for me.. the event fires after a delay. I want the window to open only if i have hovered over the link for over 500 ms. It shouldn't open otherwise. I tried doing this but the mouseout event is inconsistent. It fires when I bring the mouse over the link AND when I move out of the link.

    This is what i tried to do:
    appointmentIcon is a <li> element in the html file.

    Code:
    var appointmentIcon = Ext.get('appointmentIcon');
        appointmentIcon.on({
                    'mouseover' : {
                        fn : function() {
                            Ext.Msg.alert('MouseOver!', 'Fired!');
                        },
                        buffer : 500
                    },
                    'mouseout' : {
                        fn : function() {
                            appointmentIcon.swallowEvent('mouseover', true);
                        }
                    }
                });

  7. #7
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,553
    Vote Rating
    1272
      0  

    Default

    That gets a little tricky and something that an option to a listener is not going to be able to handle.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  8. #8
    Sencha User
    Join Date
    Dec 2010
    Posts
    126
    Vote Rating
    0
      0  

    Default

    could you point me in the right direction? I'll check out how the tooltip is designed.. that does what I want to achieve here.

  9. #9
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,553
    Vote Rating
    1272
      0  

    Default

    On mouseover I would set a time when the event happened so you can reference it with the mouseout event and then do a calculation to see if it has been 500ms. Make sure to test it with the mindset of trying to break it. It should work no problem but test it never the less.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  10. #10
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,553
    Vote Rating
    1272
      0  

    Default

    Wait, you are using a ToolTip or QuickTip? If you are, there is a showDelay config that should do what you want I think. If you aren't then do what I said before.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

Page 1 of 2 12 LastLast

Similar Threads

  1. Replies: 4
    Last Post: 2 Mar 2011, 9:55 PM
  2. problem: mouseover calling twice & delay question
    By headroot in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 21 Jun 2009, 2:00 AM
  3. too much delay
    By zeta28 in forum Ext 1.x: Help & Discussion
    Replies: 0
    Last Post: 16 Jan 2008, 4:37 AM
  4. Delay before page can be used
    By fwabbly in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 10 Dec 2007, 8:53 AM
  5. Why the Delay
    By ekatz in forum Community Discussion
    Replies: 1
    Last Post: 13 Aug 2007, 12:08 PM

Tags for this Thread

Posting Permissions

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