complicated OnMouseOver

[windandwaves]

Hi Gurus

I am trying to make this rather complicated maps with an a huge number of mouseovers and the like.

I want to set up a function that OnMouseDown swaps the OnMouseOver and OnMouseOut for the same element.

E.g.
<A HREF="#"
OnMouseOver="A( ); return true"
OnMouseOut"B(); return true;"
OnMouseDown="S( ); return false;"[color=blue]
>[/color]

where...

function S () {
'swap onMouseOver with OnMouseOut.....
}

I would prefer not to work with IDs (as there are just so many A HREFs) but maybe with something like "me" or "this" if that exists.

Then, to make it all more complicated, I need to be able to read which areas received a swap....

For your information, the OnMouseOver and OnMouseOut swap images (highlights part of the map).

TIA

- Nicolaas

[windandwaves]

Re: complicated OnMouseOver


"windandwav es" <winandwaves@co ldmail.com> wrote

For your information, the map can be found here:

http://switch.hosts.net.nz/~admin64/m/m.html

Thank you

- Nicolaas

[Michael Winter]

Re: complicated OnMouseOver

windandwaves wrote:

[snip]
[color=blue]
> I want to set up a function that OnMouseDown swaps the OnMouseOver
> and OnMouseOut for the same element.[/color]

[snip]

function swap(e) {var t;
t = e.mouseover;
e.mouseover = e.mouseout;
e.mouseout = t;
return false;
}

<a ... onmousedown="re turn swap(this);">

The this operator provides a reference to the target of the event -
the link.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

[windandwaves]

Re: complicated OnMouseOver


"Michael Winter" <m.winter@bluey onder.co.invali d> wrote in message news:SziSd.1976 4$8B3.19498@tex t.news.blueyond er.co.uk...[color=blue]
> windandwaves wrote:
>
> [snip]
>[color=green]
>> I want to set up a function that OnMouseDown swaps the OnMouseOver
>> and OnMouseOut for the same element.[/color]
>
> [snip]
>
> function swap(e) {var t;
> t = e.mouseover;
> e.mouseover = e.mouseout;
> e.mouseout = t;
> return false;
> }
>
> <a ... onmousedown="re turn swap(this);">
>
> The this operator provides a reference to the target of the event -
> the link.
>
> Mike
>[/color]

Thanks Mike, brilliant as always. Thank you so MUCH!

[windandwaves]

Re: complicated OnMouseOver


"Michael Winter" <m.winter@bluey onder.co.invali d> wrote in message news:SziSd.1976 4$8B3.19498@tex t.news.blueyond er.co.uk...

[...]
[color=blue]
>
> function swap(e) {var t;
> t = e.mouseover;
> e.mouseover = e.mouseout;
> e.mouseout = t;
> return false;
> }
>
> <a ... onmousedown="re turn swap(this);">[/color]

to make it work for me, I just had to add the "on" part i.e.

function swap(e) {var t;
t = e.onmouseover;
e.onmouseover = e.onmouseout;
e.onmouseout = t;
return false;
}

Now, of course (!), I have another problem, I need to also swap the onmouseover and onmouseout for the other <A HREFs> that share
the same onmouseover and onmouseout elements. I have written this function, but it does not seem to work (yet):

function findothers(ono1 ){
var el;
var c;
el = document.all.ta gs("A");
c = el.length
for(var i = 0; i < c; i++){
var e = el(i);
var ono2 = e.onmouseover;
if (ono1 == ono2) {
swap(e);
}
}
}

Any help greatly appreciated.

- Nicolaas

[Michael Winter]

Re: complicated OnMouseOver

windandwaves wrote:

[snip]
[color=blue]
> to make it work for me, I just had to add the "on" part[/color]

Oops. Sorry.

[snip]
[color=blue]
> Now, of course (!), I have another problem, I need to also swap the
> onmouseover and onmouseout for the other <A HREFs> that share the
> same onmouseover and onmouseout elements.[/color]

When are you doing this? Just whenever you call the new function?

function swapAll(l) {
for(var c = document.links, i = 0, n = c.length; i < n; ++i) {
if(c[i].onmouseover == l) {swap(c[i]);}
}
}

The links collection contains all A elements with href attributes.
Like other DOM collections, you /should/ be able to index it by name
(that is, an id or name attribute value) however IE doesn't support
this for some reason.
[color=blue]
> function findothers(ono1 ){
> var el;
> var c;
> el = document.all.ta gs("A");[/color]

It would be better to use document.getEle mentsByTagName. The all
collection and its properties should only be used for IE4. Newer IE
versions support the equivalent DOM methods.
[color=blue]
> c = el.length
> for(var i = 0; i < c; i++){
> var e = el(i);[/color]

Use square brackets not parentheses. That should be interpreted as a
function call by any sane user agent.

[snip]

Hope that helps,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

[RobG]

Re: complicated OnMouseOver

windandwaves wrote:
[...][color=blue]
> Now, of course (!), I have another problem, I need to also swap the onmouseover and onmouseout for the other <A HREFs> that share
> the same onmouseover and onmouseout elements. I have written this function, but it does not seem to work (yet):
>
> function findothers(ono1 ){[/color]

What is ono1?

Case 1: Is it a reference to an onmouseover event, like:

...
var ono1 = someElement.onm ouseover;
findothers(ono1 );
...

Case 2: Is a reference to an element that has an onmouseover:

var ono1 = document.getEle mentById('eleme ntWithAnOnmouse over');
findothers(ono1 );

Case 3: It is the string name of an onmouseover that has been
defined elsewhere:

function aFunkyFunc(){
...
}

...
var ono1 = 'aFunkyFunc';
findothers(ono1 );
...
[color=blue]
> var el;
> var c;
> el = document.all.ta gs("A");[/color]

You seem to like IE, but a more cross-browser way is:

if (document.getEl ementsByTagName ) {
var el = document.getEle mentsByTagName( 'A');
} else if (document.all) {
var el = document.all.ta gs('A');
}

And you can declare the variables el & c and give them values
when you first use them. Sometimes in long scripts it's nice to
declare them all in one spot so you don't accidentally double-up
on names, but for short scripts, it's common to declare them and
give them values at the same time, right where you need them.
[color=blue]
> c = el.length
> for(var i = 0; i < c; i++){[/color]

This will run a lot faster as:

for ( var c = el.length - 1; c >= 0; c-- ) {
[color=blue]
> var e = el(i);
> var ono2 = e.onmouseover;
> if (ono1 == ono2) {[/color]

Why bother with ono2? You only use it once, so don't bother to
create it (unless you have some other use for it not shown here).

Assuming case 1 above:

var e = el[c];
if ( ono1 == e.onmouseover ){
swap(e);
}

Assuming case 2 above:

var e = el[c];
if ( ono1.onmouseove r == e.onmouseover ){
swap(e);
}

Assuming case 3 above:

I can't help, I don't know how to get the name of the function
attached to an onmouseover unless you use some IE only method
(innerText? adjacentHTML?). Maybe it can be done with regExp.

Mike?

All of the above is offered as a suggestion, untested of course.

e.onmouseover is actually the entire script, not just the name of
the function. Do alert(e.onmouse over) and you'll see what I
mean.

e.g.

<script type="text/javascript">
function hiNic(a){
alert(a.onmouse over);
}
</script>
<span onmouseover="hi Nic(this)">blah blah blah</span>

Displays:

function onmouseover(eve nt) {
hiNic(this);
}

--
Rob

[windandwaves]

Re: complicated OnMouseOver


"RobG" <rgqld@iinet.ne t.auau> wrote in message news:421b3bbf$0 $24209$5a62ac22 @per-qv1-newsreader-01.iinet.net.au ...[color=blue]
> windandwaves wrote:
> [...][color=green]
>> Now, of course (!), I have another problem, I need to also swap the onmouseover and onmouseout for the other <A HREFs> that share
>> the same onmouseover and onmouseout elements. I have written this function, but it does not seem to work (yet):
>>
>> function findothers(ono1 ){[/color]
>
> What is ono1?
>
> Case 1: Is it a reference to an onmouseover event, like:
>
> ...
> var ono1 = someElement.onm ouseover;
> findothers(ono1 );
> ...
>
> Case 2: Is a reference to an element that has an onmouseover:
>
> var ono1 = document.getEle mentById('eleme ntWithAnOnmouse over');
> findothers(ono1 );
>
> Case 3: It is the string name of an onmouseover that has been
> defined elsewhere:
>
> function aFunkyFunc(){
> ...
> }
>
> ...
> var ono1 = 'aFunkyFunc';
> findothers(ono1 );
> ...
>[color=green]
>> var el;
>> var c;
>> el = document.all.ta gs("A");[/color]
>
> You seem to like IE, but a more cross-browser way is:
>
> if (document.getEl ementsByTagName ) {
> var el = document.getEle mentsByTagName( 'A');
> } else if (document.all) {
> var el = document.all.ta gs('A');
> }
>
> And you can declare the variables el & c and give them values
> when you first use them. Sometimes in long scripts it's nice to
> declare them all in one spot so you don't accidentally double-up
> on names, but for short scripts, it's common to declare them and
> give them values at the same time, right where you need them.
>[color=green]
>> c = el.length
>> for(var i = 0; i < c; i++){[/color]
>
> This will run a lot faster as:
>
> for ( var c = el.length - 1; c >= 0; c-- ) {
>[color=green]
>> var e = el(i);
>> var ono2 = e.onmouseover;
>> if (ono1 == ono2) {[/color]
>
> Why bother with ono2? You only use it once, so don't bother to
> create it (unless you have some other use for it not shown here).
>
> Assuming case 1 above:
>
> var e = el[c];
> if ( ono1 == e.onmouseover ){
> swap(e);
> }
>
> Assuming case 2 above:
>
> var e = el[c];
> if ( ono1.onmouseove r == e.onmouseover ){
> swap(e);
> }
>
> Assuming case 3 above:
>
> I can't help, I don't know how to get the name of the function
> attached to an onmouseover unless you use some IE only method
> (innerText? adjacentHTML?). Maybe it can be done with regExp.
>
> Mike?
>
> All of the above is offered as a suggestion, untested of course.
>
> e.onmouseover is actually the entire script, not just the name of
> the function. Do alert(e.onmouse over) and you'll see what I
> mean.
>
> e.g.
>
> <script type="text/javascript">
> function hiNic(a){
> alert(a.onmouse over);
> }
> </script>
> <span onmouseover="hi Nic(this)">blah blah blah</span>
>
> Displays:
>
> function onmouseover(eve nt) {
> hiNic(this);
> }
>
> --
> Rob[/color]

Thanks for the in-depth reply Rob, I kind of had to go another way with my project, but the post above was brilliant, it basically
helped me to understand a lot better all the things that I was doing wrong!

Thank all of you again for all the notes.

- Nicolaas