Forums

Board index » YUI 3 Gallery Forums: » Gallery Forums » Accordion

Page 1 of 1   [ 5 posts ]
New Topic | Post Reply | Print view

Bubu Bear

  • Username: Bububear
  • Joined: Thu Feb 17, 2011 3:53 pm
  • Posts: 2
  • Offline
  • Profile
Tags:

Issue when Accordion.itemChosen is set to "mouseover"

Post Posted: Thu Feb 17, 2011 4:13 pm
+0-
There's an issue I found that occurs when the following conditions are set


1) Set Accordion.itemChosen to "mouseover"
2) Set Accordion.collapseOthersOnExpand to "true"
3) Text is placed inside a "yui3-accordion-item-label" context
For example <div class="yui3-accordion-item-label">Some Label</div>

Now, there is no issue if you avoid mousing over the text area of an item label. You can mouseover from item to item and the events are triggered as they should.

However, once you touch upon the text rectangle of an item as contained in 3 above, it triggers a mouseout event, causing accordion items to collapse unintentionally. This creates a kind of "hiccup" effect.

Iliyan Peychev

YUI Contributor

  • Username: peychevi
  • Joined: Tue Feb 24, 2009 12:38 pm
  • Posts: 136
  • Location: Varna, Bulgaria
  • Twitter: ipeychev
  • GitHub: ipeychev
  • Gists: ipeychev
  • Offline
  • Profile
Tags:

Re: Issue when Accordion.itemChosen is set to "mouseover"

Post Posted: Fri Feb 18, 2011 9:37 am
+0-
Bububear wrote:
There's an issue I found that occurs when the following conditions are set


1) Set Accordion.itemChosen to "mouseover"
2) Set Accordion.collapseOthersOnExpand to "true"
3) Text is placed inside a "yui3-accordion-item-label" context
For example <div class="yui3-accordion-item-label">Some Label</div>

Now, there is no issue if you avoid mousing over the text area of an item label. You can mouseover from item to item and the events are triggered as they should.

However, once you touch upon the text rectangle of an item as contained in 3 above, it triggers a mouseout event, causing accordion items to collapse unintentionally. This creates a kind of "hiccup" effect.


In order to avoid that effect, you should set 'mouseenter', not 'mouseover'. That will work, but unfortunately Accordion wouldn't be able to determine if the user interacted with any of the icons (these for item 'close' and 'set always on top').

What I am going to do is the following - the developer will be able to specify multiple events in 'itemChosen' property (separated with comma). In this way you will be able to specify 'click, mouseenter' and everything will work fine - the user will be able to expand/collapse items on hovering the mouse and on click she will be able to set an item as always visible, to close it, etc. If there is no mouse attached to this machine, that will still work, because the 'click' event will handle this, as it is now.
Right now 'itemChosen' expects string, which is perfect - I will not make any changes to the API. I should only split the events and do a 'for' loop (because Node.delegate does not receive multiple events neither) and that will be everything.

Makes sense?

Iliyan

Iliyan Peychev

YUI Contributor

  • Username: peychevi
  • Joined: Tue Feb 24, 2009 12:38 pm
  • Posts: 136
  • Location: Varna, Bulgaria
  • Twitter: ipeychev
  • GitHub: ipeychev
  • Gists: ipeychev
  • Offline
  • Profile

Re: Issue when Accordion.itemChosen is set to "mouseover"

Post Posted: Tue Feb 22, 2011 3:02 pm
+0-
Okay, just committed that change: now you can specify
Code:
this.accordion1 = new Y.Accordion( {
    srcNode: "#acc1",
    itemChosen: ['click', 'mouseenter']
});


This should do the trick. Soon this change will be pushed to Yahoo! CDN; meanwhile, you can use the version from GitHub.

Iliyan

Iliyan Peychev

YUI Contributor

  • Username: peychevi
  • Joined: Tue Feb 24, 2009 12:38 pm
  • Posts: 136
  • Location: Varna, Bulgaria
  • Twitter: ipeychev
  • GitHub: ipeychev
  • Gists: ipeychev
  • Offline
  • Profile

Re: Issue when Accordion.itemChosen is set to "mouseover"

Post Posted: Wed Feb 23, 2011 12:21 pm
+0-
YUI Team just pushed it - here is the build tag:
gallery-2011.02.23-19-01

Iliyan

Bubu Bear

  • Username: Bububear
  • Joined: Thu Feb 17, 2011 3:53 pm
  • Posts: 2
  • Offline
  • Profile

Re: Issue when Accordion.itemChosen is set to "mouseover"

Post Posted: Thu Feb 24, 2011 4:49 pm
+0-
Thanks Iliyan.

Actually, for my current needs, just specifying "mouseenter" is sufficient, since I'm not using it in conjunction with other clickable events. But I'm sure your fix will come in handy down the line.

Excellent work. This accordion is working out great !!! :D
Page 1 of 1   [ 5 posts ]
New Topic | Post Reply | Print view
Display posts from previous:  Sort by  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum

Recent Forums Posts

Recent YUI Blog Posts

Online Users

© 2006-2013 Yahoo! Inc. All rights reserved.
All code on this site is licensed under the BSD License unless stated otherwise.
About This Site · Security Contact Info

Powered by phpBB® Forum Software © phpBB Group