Event problems

0 views
Skip to first unread message

Cristisor

unread,
Aug 13, 2008, 5:56:37 AM8/13/08
to Prototype: Core
Hi everyone. I'm a beginner in JS and I have 2 small problems that I
can't figure out.
1. How can I fire the 'blur' event on an object with the id='abc' for
example, using the Event.fire method? They say something but I don't
understand so maybe you can help me with an example.
2. In IE 6 the mouseout event won't work and I don't understand why.
the mouseover works perfectly fine. here is the function where I'm
using it, maybe you can see another mistake:

$(minimize).observe('mouseover', (function(event) {
$(minimize).innerHTML = "<img src=\"images/gadget/
minimize_hover.png\">";
}).bind(this));

$(minimize).observe('mouseout', (function(event) {
$(minimize).innerHTML = "<img src=\"images/gadget/
minimize_normal.png\">";
}).bind(this));

Thank you in advance.

Christophe Porteneuve

unread,
Aug 13, 2008, 6:05:35 AM8/13/08
to prototy...@googlegroups.com
Cristisor a écrit :

> 1. How can I fire the 'blur' event on an object with the id='abc' for
> example, using the Event.fire method? They say something but I don't
> understand so maybe you can help me with an example.

How about just $('abc').blur()?

> 2. In IE 6 the mouseout event won't work and I don't understand why.
> the mouseover works perfectly fine. here is the function where I'm
> using it, maybe you can see another mistake:

You'll need to provide an online minimalistic reproduction of your issue.

Anyway instead of using events for what you have here, you should just
use CSS and the :hover class for your id="minimize" link, with a
background image (best: use CSS Tiling for optimal speed). Much cleaner…


--
Christophe Porteneuve aka TDD
t...@tddsworld.com

Cristisor

unread,
Aug 13, 2008, 6:19:20 AM8/13/08
to Prototype: Core
1. $('abc').blur() won't work. This is what they say on their
website:
Note

Element#fire does not support firing native events. All custom event
names must be namespaced (using a colon). This is to avoid custom
event names conflicting with non-standard native DOM events such as
mousewheel and DOMMouseScroll.

Example:
var someNode = $('foo');
someNode.fire("widget:frobbed", { widgetNumber: 19 });

//-> "Element with ID (foo) frobbed widget #19."

But I don't really understand what's with those namespaces, that's why
I need help

2. It's curious because the mouseover event works fine, the mouseout
doesn't. If I don't find any way to solve the problem, I will do like
you said.

Thank you very much for your help.

Christophe Porteneuve

unread,
Aug 13, 2008, 7:42:48 AM8/13/08
to prototy...@googlegroups.com
Cristisor a écrit :

> 1. $('abc').blur() won't work.

Er, hang on a sec. You're trying to blur an item, right? The blur
event is native, cannot be reliably emulated across browsers, but if
you're effectively blurring an element, its blur event will occur.

Since blur events _don't bubble anyway_ [1], there's no point in just
firing the event for the sake of it. But calling blur() on a focusable
element will, for sure, blur it if it had the focus.

[1]
http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-eventgroupings-htmlevents

Tobie Langel

unread,
Aug 13, 2008, 8:32:06 AM8/13/08
to Prototype: Core

> > 1. $('abc').blur() won't work.
>
> Er, hang on a sec.  You're trying to blur an item, right?  The blur
> event is native, cannot be reliably emulated across browsers, but if
> you're effectively blurring an element, its blur event will occur.

Actually whether or not $('abc').blur() triggers a blur event is
implementation dependant, just like $('my_form).submit() won't
necessarily trigger the submit event.

In both cases, however, the default action (respectively: loosing
focus and submitting the form) _will_ happen.

Note that focusing another element will cause 'abc' to loose focus
_and_ trigger a blur event from it.

Tobie Langel

unread,
Aug 13, 2008, 8:34:04 AM8/13/08
to Prototype: Core
Also, please kindly post assistance requests in the
http://groups.google.com/group/prototype-scriptaculous mailing list.

This list is reserved for development purposes.

Thank you!

Tobie

John-David Dalton

unread,
Aug 13, 2008, 9:12:55 AM8/13/08
to Prototype: Core
Try Kangax's Event.Simulate:
http://github.com/kangax/protolicious/tree/master/event.simulate.js

$(element).simulate('blur'); // should do it
Reply all
Reply to author
Forward
0 new messages