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;"
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 7 3335
windandwaves wrote:
[snip] I want to set up a function that OnMouseDown swaps the OnMouseOver and OnMouseOut for the same element.
[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.
"Michael Winter" <m.******@bluey onder.co.invali d> wrote in message news:Sz******** ***********@tex t.news.blueyond er.co.uk... windandwaves wrote:
[snip]
I want to set up a function that OnMouseDown swaps the OnMouseOver and OnMouseOut for the same element.
[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
Thanks Mike, brilliant as always. Thank you so MUCH!
"Michael Winter" <m.******@bluey onder.co.invali d> wrote in message news:Sz******** ***********@tex t.news.blueyond er.co.uk...
[...] function swap(e) {var t; t = e.mouseover; e.mouseover = e.mouseout; e.mouseout = t; return false; }
<a ... onmousedown="re turn swap(this);">
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
windandwaves wrote:
[snip] to make it work for me, I just had to add the "on" part
Oops. Sorry.
[snip]
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.
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.
function findothers(ono1 ){ var el; var c; el = document.all.ta gs("A");
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.
c = el.length for(var i = 0; i < c; i++){ var e = el(i);
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.
windandwaves wrote:
[...] 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 ){
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 );
...
var el; var c; el = document.all.ta gs("A");
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.
c = el.length for(var i = 0; i < c; i++){
This will run a lot faster as:
for ( var c = el.length - 1; c >= 0; c-- ) {
var e = el(i); var ono2 = e.onmouseover; if (ono1 == ono2) {
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
"RobG" <rg***@iinet.ne t.auau> wrote in message news:42******** *************** @per-qv1-newsreader-01.iinet.net.au ... windandwaves wrote: [...] 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 ){
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 ); ...
var el; var c; el = document.all.ta gs("A");
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.
c = el.length for(var i = 0; i < c; i++){
This will run a lot faster as:
for ( var c = el.length - 1; c >= 0; c-- ) {
var e = el(i); var ono2 = e.onmouseover; if (ono1 == ono2) {
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
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 This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics |
by: Richard |
last post by:
I know I can have like <a href="#" onclick="dothis" onmouseover="dothat">
But how do you properly code two mouseover's in one statement?
<a href="#" onmousever="dothis" onmouseover="dothat">
As an example of use:
Column A holds menu items.
When a mouse over is performed, two actions take place instead of one.
Action one sends an image to a division in column B, action two sends text
to another division in column B.
|
by: news.west.cox.net |
last post by:
I have been writing a practice sliding div navigation script. I am finding
myself in the position where I need to force a div into showing the hover
behavior defined in css.
So my question is this. If I have two divs, is there a way to make the
second div display its onmouseover behavior when the mouse is over div 1?
|
by: drjackk |
last post by:
Hello,
I'm trying to change the onmouseover event dynamically.
This sets-up the initial onmouseover event:
<a href="home.html"> <img border="0" id="img22"
src="images/home1.jpg" height="15" width="85" alt="Home"
onmouseover="FP_swapImg(1,0,/*id*/'img22',/*url*/'images/home2.jpg')"</a>
|
by: MrCode2k |
last post by:
Hello,
Trying to do: I just want a table that I can scroll and that has fixed
headers.
Problem: I got it to work but when I added the onmouseover event it
didn't work anymore.
Replicate-Problem: Scrolldown the textbox and put the mouse over a row.
|
by: MrCode2k |
last post by:
Hello,
Trying to do: I just want a table that I can scroll and that has fixed
headers.
Problem: I got it to work but when I added the onmouseover event it
didn't work anymore.
Replicate-Problem: Scrolldown the textbox and put the mouse over a row.
| |
by: Justin Rowe |
last post by:
I'm attempting to design a site with alot of dynamic content and
intractability, however I've hit a snag when it comes to the function of
the onMouseOver and onMouseOut events. Using a bit of code from
QuirksMode to grab the location of the mouse, I've built a tooltip
function to show a tooltip to the user depicting the target of a link,
the problem is when you mouse over the box that the tooltip function is
attatched to the tooltip...
|
by: den2005 |
last post by:
Hi everybody,
I am confused and still looking why this codes is not working. Can anyone notice or know why this code is not working? Thanks in advance.
Code working:
<form id="form1" runat="server">
<div>
</div>
<div>
|
by: oopaevah |
last post by:
I have written some dom code to create a list of divs, each with it's
own id. I want to set the onmouseover and onmouseout events to
highlight the div when the mouse is over it. However I cannot use the
method below because oDiv.id is always set to the last div I create -
so the last div is highlighted regardless of which div I am onmouseover
This must be a common issue, how do I go about fixing it?
I can have a separate function which...
|
by: Daz |
last post by:
Hi everyone.
I think my problem is a simple one, but I am completely baffled as to
how to pull it off.
I have a piece of code like so...
document.write(
"<img id=\"slideshow_toggle\" src=\"img/stop_slideshow.png\" "
+ "onMouseOver=\"src='./img/stop_slideshow_hover.png'\" "
+ "onMouseOut=\"src='./img/stop_slideshow.png'\" "
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it.
Here is my compilation command:
g++-12 -std=c++20 -Wnarrowing bit_field.cpp
Here is the code in...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
| |
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert into image.
Globals.ThisAddIn.Application.ActiveDocument.Select();...
|
by: TSSRALBI |
last post by:
Hello
I'm a network technician in training and I need your help.
I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs.
The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols.
I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
|
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...
| |