[jQuery] Re: How to Select element with class, but EXCLUDE its children?
I see. Good to know. Let's let this thread die and stay on the other one. I sent you a reply in that one. On Nov 1, 1:51 pm, Karl Swedberg wrote: > On Nov 1, 2009, at 1:49 PM, jmatthews wrote: > > > On the topic of mouseenter and mouseleave, which some of you > > recommended, quirksmode says only IE supports this method, and the > > others do not at this time. The quirksmode sponsor is very critical > > of their failure to incorporate these methods because it would make > > the coding far less complex. > > > So, I guess that is why your suggestions were not working for me > > >http://www.quirksmode.org/dom/events/index.html > > jQuery normalizes the .mouseenter() and .mouseleave() methods across > all browsers so they act the same way as IE's native mouseenter and > mouseleave. > > --Karl > > > Karl Swedbergwww.englishrules.comwww.learningjquery.com
Re: [jQuery] Re: How to Select element with class, but EXCLUDE its children?
On Nov 1, 2009, at 1:49 PM, jmatthews wrote: On the topic of mouseenter and mouseleave, which some of you recommended, quirksmode says only IE supports this method, and the others do not at this time. The quirksmode sponsor is very critical of their failure to incorporate these methods because it would make the coding far less complex. So, I guess that is why your suggestions were not working for me http://www.quirksmode.org/dom/events/index.html jQuery normalizes the .mouseenter() and .mouseleave() methods across all browsers so they act the same way as IE's native mouseenter and mouseleave. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
On the topic of mouseenter and mouseleave, which some of you recommended, quirksmode says only IE supports this method, and the others do not at this time. The quirksmode sponsor is very critical of their failure to incorporate these methods because it would make the coding far less complex. So, I guess that is why your suggestions were not working for me http://www.quirksmode.org/dom/events/index.html
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
On the topic of mouseenter and mouseleave, which some of you recommended, quirksmode says only IE supports this method, and the others do not at this time. The quirksmode sponsor is very critical of their failure to incorporate these methods because it would make the coding far less complex. So, I guess that is why your suggestions were not working for me http://www.quirksmode.org/dom/events/index.html
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
On the topic of mouseenter and mouseleave, which some of you recommended, quirksmode says only IE supports this method, and the others do not at this time. The quirksmode sponsor is very critical of their failure to incorporate these methods because it would make the coding far less complex. So, I guess that is why your suggestions were not working for me http://www.quirksmode.org/dom/events/index.html
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
Andrei, I think you've hit it! I really don't quite understand the quirksmode material as well as you veteran programmers, but I can tell this is the crux of the issue and how to handle it. It has to do with handling fromElement and relatedTarget. Do you think you could assist with this in order to derive the proper mouseover/mouseout jquery syntax indcorporating the relatedTarget and fromElement properties described in quirksmode? Here is a portion of the quirksmode article that is discussing the issue: \ Cross–browser scripts So if you want to know where the mouse comes from in case of mouseover, do: function doSomething(e) { if (!e) var e = window.event; var relTarg = e.relatedTarget || e.fromElement; } If you want to know where the mouse goes to in case of mouseout, do:
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
Andrei, I think you've hit it! I really don't quite understand the quirksmode material as well as you veteran programmers, but I can tell this is the crux of the issue and how to handle it. It has to do with handling fromElement and relatedTarget. Do you think you could assist with this in order to derive the proper mouseover/mouseout jquery syntax indcorporating the relatedTarget and fromElement properties described in quirksmode? Here is a portion of the quirksmode article that is discussing the issue: \ Cross–browser scripts So if you want to know where the mouse comes from in case of mouseover, do: function doSomething(e) { if (!e) var e = window.event; var relTarg = e.relatedTarget || e.fromElement; } If you want to know where the mouse goes to in case of mouseout, do:
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
Andrei, I think you've hit it! I really don't quite understand the quirksmode material as well as you veteran programmers, but I can tell this is the crux of the issue and how to handle it. It has to do with handling fromElement and relatedTarget. Do you think you could assist with this in order to derive the proper mouseover/mouseout jquery syntax indcorporating the relatedTarget and fromElement properties described in quirksmode? Here is a portion of the quirksmode article that is discussing the issue: \ Cross–browser scripts So if you want to know where the mouse comes from in case of mouseover, do: function doSomething(e) { if (!e) var e = window.event; var relTarg = e.relatedTarget || e.fromElement; } If you want to know where the mouse goes to in case of mouseout, do:
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
Andrei, I think you've hit it! I really don't quite understand the quirksmode material as well as you veteran programmers, but I can tell this is the crux of the issue and how to handle it. It has to do with handling fromElement and relatedTarget. Do you think you could assist with this in order to derive the proper mouseover/mouseout jquery syntax indcorporating the relatedTarget and fromElement properties described in quirksmode? Here is a portion of the quirksmode article that is discussing the issue: \ Cross–browser scripts So if you want to know where the mouse comes from in case of mouseover, do: function doSomething(e) { if (!e) var e = window.event; var relTarg = e.relatedTarget || e.fromElement; } If you want to know where the mouse goes to in case of mouseout, do:
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
Andrei, I think you've hit it! I really don't quite understand the quirksmode material as well as you veteran programmers, but I can tell this is the crux of the issue and how to handle it. It has to do with handling fromElement and relatedTarget. Do you think you could assist with this in order to derive the proper mouseover/mouseout jquery syntax indcorporating the relatedTarget and fromElement properties described in quirksmode? Here is a portion of the quirksmode article that is discussing the issue: \ Cross–browser scripts So if you want to know where the mouse comes from in case of mouseover, do: function doSomething(e) { if (!e) var e = window.event; var relTarg = e.relatedTarget || e.fromElement; } If you want to know where the mouse goes to in case of mouseout, do:
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
BTW, Andrei. Now that the map stuff loaded, the next time you load the page, it should be pretty quick. If not, let me know.
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
BTW, Andrei. Now that the map stuff loaded, the next time you load the page, it should be pretty quick. If not, let me know.
Re: [jQuery] Re: How to Select element with class, but EXCLUDE its children?
I understand where you come from. My exprimation was somewhat off. Please replace with desired with *implemented* or *the-way-it-actually-works-in-browsers*. Not sure if it is intended or just the way it is working with now. Please check the links from quirksmode for further details. On Sun, Nov 1, 2009 at 7:21 PM, jmatthews wrote: > > > On Nov 1, 10:54 am, Andrei Eftimie wrote: >> > Mousing over class="placemark" causes it to fire as if there was a >> > mouseover on class="Senate." "placemark" has its own class, separate >> > from the "senate" class. >> >> This behaviour is actually the way it supposed to be. >> mouseover and mouseout fire on each entering / exiting of the elements >> and ever element descendants border. >> >> You would want mouseenter and mouseleave to fire *only* on the trigger >> element, and ignore its descendants. >> > > > Andrei, if this is the desired behavior, I don't understand why it > should be. The way I see it is, to use a simpler example: > > Goodbye > Hello. > > > $(".class1").onmouseover( > > $(".class2").onmouseover( > > So, when you mouever class2, it is pretty much pointless, because it > fires as if you mouse over class1. > -- Andrei Eftimie http://eftimie.com +40 758 833 281 Punct http://designpunct.ro
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
BTW, Andrei. Now that the map stuff loaded, the next time you load the page, it should be pretty quick. If not, let me know.
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
On Nov 1, 10:54 am, Andrei Eftimie wrote: > > Mousing over class="placemark" causes it to fire as if there was a > > mouseover on class="Senate." "placemark" has its own class, separate > > from the "senate" class. > > This behaviour is actually the way it supposed to be. > mouseover and mouseout fire on each entering / exiting of the elements > and ever element descendants border. > > You would want mouseenter and mouseleave to fire *only* on the trigger > element, and ignore its descendants. > Andrei, if this is the desired behavior, I don't understand why it should be. The way I see it is, to use a simpler example: Goodbye Hello. $(".class1").onmouseover( $(".class2").onmouseover( So, when you mouever class2, it is pretty much pointless, because it fires as if you mouse over class1.
Re: [jQuery] Re: How to Select element with class, but EXCLUDE its children?
> Mousing over class="placemark" causes it to fire as if there was a > mouseover on class="Senate." "placemark" has its own class, separate > from the "senate" class. This behaviour is actually the way it supposed to be. mouseover and mouseout fire on each entering / exiting of the elements and ever element descendants border. You would want mouseenter and mouseleave to fire *only* on the trigger element, and ignore its descendants. > Click on the Alabama Senate. It will open a scroll within the scroll > on the left, showing Alabama's senator's names. When you mouse over > senator names, the system interprets that as ALSO a mouseover the > "Senate" label at the top. This should not be the case. See above. > In any event, the senator names are, quite literally, great-great- > great-great grandchildren of the "Senate" label. How on earth would > mousing over the grandchild be the same as mousing over its > ascendant 6 generations above? Not sure on the specific details right now, but check http://www.quirksmode.org/js/events_mouse.html for an explanation. > Also, if you are on your toes, you will note that the senator names > italicize, but do not turn blue, when you mouseover them. So, it is > somehow (God knows!) getting PART of the class of the > grandchild. The placemark class instructs to not italicize and not > turn blue. So, it does not turn blue (good), but it does italicizes > (bad). Not sure, but I think this is actually because table element does only inherit some css properties. (At least I remember it does so in quirksmode) -- Andrei Eftimie http://eftimie.com +40 758 833 281 Punct http://designpunct.ro
Re: [jQuery] Re: How to Select element with class, but EXCLUDE its children?
I'm installing GE now, but it would be great if you could create a sample test-page to highlight this particular behaviour. (and exclude everything else from that page, for easier further testing). On Sun, Nov 1, 2009 at 6:37 PM, jmatthews wrote: > I tried that, too. > > This is some bizarre behavior. It is not at all what you would > predict. > > Let me show you the Firebug-generated html tree below. > > > Senate > > > > class="outerTableForPlacemarksTable"> > > > > > > > > Lowell Ray > Barron > > > > > etc > > This is a series of nested tables, and the nesting is pretty deep, due > to html acting goofy. I had to nest that deep to get it to work. > > Mousing over class="placemark" causes it to fire as if there was a > mouseover on class="Senate." "placemark" has its own class, separate > from the "senate" class. > > > To see this in action, here is the link. > http://www.sovereignstates.net/StateLegislators/VSLegislators.htm > > It requires the Google Earth API and will prompt you to load it. > (It's nice to have, as GE is no longer just a desktop-restricted thing > anymore). > > After the Google API installs, the page should load. The initial load > is slow because it is a map with lots of point data. You should see > the US come up with colored states. Once it has loaded the first > time, subsequent loads will be fast as it stays in the browser cache. > > Click on the Alabama Senate. It will open a scroll within the scroll > on the left, showing Alabama's senator's names. When you mouse over > senator names, the system interprets that as ALSO a mouseover the > "Senate" label at the top. This should not be the case. > > In any event, the senator names are, quite literally, great-great- > great-great grandchildren of the "Senate" label. How on earth would > mousing over the grandchild be the same as mousing over its > ascendant 6 generations above? > > The only thing I can think of is the mouseover (including mouseleave) > thinks these are equivalent because the grandchildren are seen as > the innerhtml of the "Senate" label. > > Thanks to all of you who have tried to help. > > This is really perplexing, and once it is solved, there needs to be a > monument set up for the person who solves it. Seriously, though, the > issue, once resolved, would be worthy of a write-up in the reference > guide, because there is some odd behavior occurring that Jquery fails > to describe anywhere that I have seen. > > Also, if you are on your toes, you will note that the senator names > italicize, but do not turn blue, when you mouseover them. So, it is > somehow (God knows!) getting PART of the class of the > grandchild. The placemark class instructs to not italicize and not > turn blue. So, it does not turn blue (good), but it does italicizes > (bad). > > -- Andrei Eftimie http://eftimie.com +40 758 833 281 Punct http://designpunct.ro
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
I tried that, too. This is some bizarre behavior. It is not at all what you would predict. Let me show you the Firebug-generated html tree below. Senate Lowell Ray Barron etc This is a series of nested tables, and the nesting is pretty deep, due to html acting goofy. I had to nest that deep to get it to work. Mousing over class="placemark" causes it to fire as if there was a mouseover on class="Senate." "placemark" has its own class, separate from the "senate" class. To see this in action, here is the link. http://www.sovereignstates.net/StateLegislators/VSLegislators.htm It requires the Google Earth API and will prompt you to load it. (It's nice to have, as GE is no longer just a desktop-restricted thing anymore). After the Google API installs, the page should load. The initial load is slow because it is a map with lots of point data. You should see the US come up with colored states. Once it has loaded the first time, subsequent loads will be fast as it stays in the browser cache. Click on the Alabama Senate. It will open a scroll within the scroll on the left, showing Alabama's senator's names. When you mouse over senator names, the system interprets that as ALSO a mouseover the "Senate" label at the top. This should not be the case. In any event, the senator names are, quite literally, great-great- great-great grandchildren of the "Senate" label. How on earth would mousing over the grandchild be the same as mousing over its ascendant 6 generations above? The only thing I can think of is the mouseover (including mouseleave) thinks these are equivalent because the grandchildren are seen as the innerhtml of the "Senate" label. Thanks to all of you who have tried to help. This is really perplexing, and once it is solved, there needs to be a monument set up for the person who solves it. Seriously, though, the issue, once resolved, would be worthy of a write-up in the reference guide, because there is some odd behavior occurring that Jquery fails to describe anywhere that I have seen. Also, if you are on your toes, you will note that the senator names italicize, but do not turn blue, when you mouseover them. So, it is somehow (God knows!) getting PART of the class of the grandchild. The placemark class instructs to not italicize and not turn blue. So, it does not turn blue (good), but it does italicizes (bad).
Re: [jQuery] Re: How to Select element with class, but EXCLUDE its children?
HOW DO I GET OUT OF THIS LIST? ! 2009/11/1 Karl Swedberg > I'd stick with what Scott said. Use mouseenter/mouseleave. But instead of > setting the style with .css(), just add and remove a class. Here is a demo: > > http://jsbin.com/enero/edit > > > --Karl > > > Karl Swedberg > www.englishrules.com > www.learningjquery.com > > > > > On Oct 30, 2009, at 4:26 PM, jmatthews wrote: > > I tried them as the description in the reference was not clear as to > why it would be useful. > > It doesn't solve the problem. That it does is make sure that if you > reached the child by entering over the parent, the child event will be > released only by exiting back over the parent. > > Kind of odd. > > On Oct 30, 2:16 pm, Scott Sauyet wrote: > > On Oct 30, 9:30 am, jmatthews wrote: > > > When I mouseover a child, it is thinking it is just the contents of > > parent. I need to restrict mouseover to children only, regardless of > > the fact that they are encapsulated by parent. > > > You might want to look at the mouseenter and mouseleave events. > > >http://docs.jquery.com/Events/mouseenter > > > -- Scott > > > -- Un Abrazo Marcos J. Riganti +549 341 54996612 webmas...@nefertiter.com
Re: [jQuery] Re: How to Select element with class, but EXCLUDE its children?
I'd stick with what Scott said. Use mouseenter/mouseleave. But instead of setting the style with .css(), just add and remove a class. Here is a demo: http://jsbin.com/enero/edit --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 30, 2009, at 4:26 PM, jmatthews wrote: I tried them as the description in the reference was not clear as to why it would be useful. It doesn't solve the problem. That it does is make sure that if you reached the child by entering over the parent, the child event will be released only by exiting back over the parent. Kind of odd. On Oct 30, 2:16 pm, Scott Sauyet wrote: On Oct 30, 9:30 am, jmatthews wrote: When I mouseover a child, it is thinking it is just the contents of parent. I need to restrict mouseover to children only, regardless of the fact that they are encapsulated by parent. You might want to look at the mouseenter and mouseleave events. http://docs.jquery.com/Events/mouseenter -- Scott
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
I tried them as the description in the reference was not clear as to why it would be useful. It doesn't solve the problem. That it does is make sure that if you reached the child by entering over the parent, the child event will be released only by exiting back over the parent. Kind of odd. On Oct 30, 2:16 pm, Scott Sauyet wrote: > On Oct 30, 9:30 am, jmatthews wrote: > > > When I mouseover a child, it is thinking it is just the contents of > > parent. I need to restrict mouseover to children only, regardless of > > the fact that they are encapsulated by parent. > > You might want to look at the mouseenter and mouseleave events. > > http://docs.jquery.com/Events/mouseenter > > -- Scott
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
On Oct 30, 9:30 am, jmatthews wrote: > When I mouseover a child, it is thinking it is just the contents of > parent. I need to restrict mouseover to children only, regardless of > the fact that they are encapsulated by parent. You might want to look at the mouseenter and mouseleave events. http://docs.jquery.com/Events/mouseenter -- Scott
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
Okay. The problem is now this: The children are wholly contained within individual divs encapsulated by parent, as follows: state child When I mouseover a child, it is thinking it is just the contents of parent. I need to restrict mouseover to children only, regardless of the fact that they are encapsulated by parent. I hope that makes sense.
[jQuery] Re: How to Select element with class, but EXCLUDE its children?
Thanks, I tried it. It turns out that !important gives precedence to a property that has been later trumped by a more proximate designation. In my app., ".placemark" will be a class of items below state with id="AL." I was able to control it in CSS to where ONLY the parent's attributes do not apply to them. .placemark { font-size:12px; margin-left:5px; padding:0; color: black; font-style: normal; cursor: default; text-decoration: none; } However, the jquery mouseover/mouseout is not working. If I mouseover a placemark (which is a child of state), I want placemark to turn blue, but I want no effect on parent. If I mouseover parent, I want only parent to turn blue and not any placemarks. It seems all the logic is there, so I don't know why my mouseover/ mouseout is not working. $(".placemark").mouseover(function() { $(this).css({ "color" : "blue!important"}); }).mouseout(function() $(this).css({ "color" : "black!important"}); });