Overriding '<a href' with '<a onClick' for JavaScript function openWindow(URL) for image and link...

K

Kevin Lyons

Hello,

Can anyone assist me with what I am trying to do with the following
code (six different scenarios to try to make the functionality work
correctly)?

I want to always (and ONLY) display in the status bar 'Symantec
Corporation' whenever anyone mouses over (onMouseOver) my image or
link OR when one clicks while holding the left mouse down (onClick) on
the same image or link. Upon releasing the mouse (onMouseOut), the
status bar should be 'blank'. I need the link to open in a new window
via my function openWindow(URL) code.

What is happening in most of the six scenarios, is that when one
clicks the link, either the function doesn't engage, but rather the <a
href= takes effect instead OR that status bar shows
'JavaScript:eek:penWindow('http://www.symantec.com/');' when one clicks
while holding the left mouse down (onClick) on the image or link.

Additionally, for only the link, I need the CSS/style to show 'red'
when one mouses over (onMouseOver) it and then change to 'blue' upon
releasing the mouse (onMouseOut).

How about integrating 'style="cursor:hand"' into the code or perhaps
setting some of the data via a <div> or <span> snippet?

Thanks much,

Paul

----------------------

<html>
<head>
<style type="text/css">a:link {text-decoration:underline;
color:blue;}a:visited{text-decoration:underline; color:blue;}a:hover
{text-decoration:underline; color:red;}a:active
{text-decoration:underline; color:blue;}</style>
<script language="JavaScript">
function openWindow(URL) {
var availWidth = screen.availWidth + 1;
var availHeight = screen.availHeight;
var x = 0, y = 0;
if (document.all) {
x = window.screenTop;
y = window.screenLeft;
}
else if (document.layers) {
x = window.screenX;
y = window.screenY;
availWidth = availWidth - 11;
availHeight = availHeight - 155;
}
var arguments =
'resizable=yes,toolbar=yes,location=yes,directories=yes,addressbar=yes,scrollbars=yes,status=yes,menubar=yes,top=0,left=0,screenX='+x+',screenY='+y+',width='+availWidth+',height='+availHeight;
var newWindow = window.open(URL,'_blank',arguments);
}
</script>
</head>
<body marginwidth="0" marginheight="0" leftmargin="0" topmargin="0"
text="#333333" link="#336699" vlink="#336699"
alink="#990033" bgcolor="#999999">
<center>
<table>
<tr>
<td>
<b>First Scenario</b>
<a href="JavaScript:eek:penWindow('http://www.symantec.com/');"
onMouseOver="window.status='Symantec Corporation';
return true;" onMouseDown="window.status='Symantec Corporation';
return true;" onMouseOut="window.status=''; return
true;"><img src="http://www.symantec.com/images/downloads/product_shot.gif"></a>
<a href="JavaScript:eek:penWindow('http://www.symantec.com/');"
onMouseOver="window.status='Symantec Corporation';
return true;" onMouseDown="window.status='Symantec Corporation';
return true;" onMouseOut="window.status=''; return
true;">Symantec1</a>
</td><td>&nbsp;&nbsp;</td><td>
<b>Second Scenario</b>
<a onMouseOver="window.status='Symantec Corporation'; return true;"
onMouseOut="window.status='Symantec
Corporation'; return true;" onMouseDown="window.status='Symantec
Corporation'; return true;"
onClick="openWindow('http://www.symantec.com/');"><img
src="http://www.symantec.com/images/downloads/product_shot.gif"></a>
<a onMouseOver="window.status='Symantec Corporation'; return true;"
onMouseOut="window.status='Symantec
Corporation'; return true;" onMouseDown="window.status='Symantec
Corporation'; return true;"
onClick="openWindow('http://www.symantec.com/');">Symantec2</a>
</td><td>&nbsp;&nbsp;</td><td>
<b>Third Scenario</b>
<a onMouseOver="window.status='Symantec Corporation'; return true;"
onMouseOut="window.status=''; return true;"
onMouseDown="window.status='Symantec Corporation'; return true;"
onClick="openWindow('http://www.symantec.com/');"
style="cursor:hand"><img
src="http://www.symantec.com/images/downloads/product_shot.gif"></a>
<a onMouseOver="window.status='Symantec Corporation'; return true;"
onMouseOut="window.status=''; return true;"
onMouseDown="window.status='Symantec Corporation'; return true;"
onClick="openWindow('http://www.symantec.com/');"
style="cursor:hand">Symantec3</a>
</td></tr>
<tr><td><b>Fourth Scenario</b>
<a href="" onMouseOver="window.status='Symantec Corporation'; return
true;" onMouseOut="window.status=''; return
true;" onMouseDown="window.status='Symantec Corporation'; return
true;"
onClick="openWindow('http://www.symantec.com/'); return true;"
style="cursor:hand"><img
src="http://www.symantec.com/images/downloads/product_shot.gif"></a>
<a href="" onMouseOver="window.status='Symantec Corporation'; return
true;" onMouseOut="window.status=''; return
true;" onMouseDown="window.status='Symantec Corporation'; return
true;"
onClick="openWindow('http://www.symantec.com/'); return true;"
style="cursor:hand">Symantec4</a>
</td><td>&nbsp;&nbsp;</td><td>
<b>Fifth Scenario</b>
<a href="#" style="text-decoration: none; cursor: default;"
onClick="return false;" onMouseOver="window.status=' ';return
true;"><img src="http://www.symantec.com/images/downloads/product_shot.gif"></a>
<a href="#" style="text-decoration: none; cursor: default;"
onClick="return false;" onMouseOver="window.status=' ';return
true;">Symantec5</a>
</td><td>&nbsp;&nbsp;</td><td>
<b>Sixth Scenario</b>
<a onMouseOver="window.status='Symantec Corporation'; return true;"
onMouseOut="window.status=''; return true;"
onMouseDown="window.status='Symantec Corporation'; return true;"
onClick="openWindow('http://www.symantec.com/');" style="a:link
{text-decoration:underline; color:blue;}
a:visited{text-decoration:underline; color:blue;} a:hover
{text-decoration:underline; color:red;} a:active
{text-decoration:underline; color:blue;}"><img
src="http://www.symantec.com/images/downloads/product_shot.gif"></a>
<a onMouseOver="window.status='Symantec Corporation'; return true;"
onMouseOut="window.status=''; return true;"
onMouseDown="window.status='Symantec Corporation'; return true;"
onClick="openWindow('http://www.symantec.com/');" style="a:link
{text-decoration:underline; color:blue;}
a:visited{text-decoration:underline; color:blue;} a:hover
{text-decoration:underline; color:red;} a:active
{text-decoration:underline; color:blue;}">Symantec6</a>
</td>
</tr>
</table>
</body>
</html>
 
K

Kevin Lyons

All,

First of all, I errored, I would prefer the status to show
'http://www.symantec.com/' for onMouseOver and onClick instead of
'Symantec Corporation'.

After making some changes, by adding 'return false;' in the onClick
handler it is doing the trick for the '<a href=' portion!!

I have added this JavaScript line 'var hrefName =
"http://www.symantec.com/";' to show how I need it enhanced. The
reason for this is because I am going to display a different
link/company depending upon other code in the file and need the '<a
href=' to reference a variable array of URLs.

In the meantime, all is now working with my additions but please see
the '<a href=hrefName' portion below.

How can I pass a JavaScript variable to the '<a href=' portion of the
HTML?

By the way, I am primarily interested in getting it to work correctly
for Internet Explorer.

------------------------------------------------------

<a href="http://www.symantec.com/"
onClick="openWindow(hrefName);return false"
onMouseOver="window.status=hrefName"
onMouseDown="window.status=hrefName"
onMouseOut="window.status=''"><img
src="http://www.symantec.com/images/downloads/product_shot.gif"></a>
<a href="http://www.symantec.com/"
onClick="openWindow(hrefName);return false"
onMouseOver="window.status=hrefName;"
onMouseDown="window.status=hrefName"
onMouseOut="window.status=''">Symantec10</a>
<a href=hrefName onClick="openWindow(hrefName);return false"
onMouseOver="window.status=hrefName"
onMouseDown="window.status=hrefName"
onMouseOut="window.status=''"><img
src="http://www.symantec.com/images/downloads/product_shot.gif"></a>
<a href=hrefName onClick="openWindow(hrefName);return false"
onMouseOver="window.status=hrefName;"
onMouseDown="window.status=hrefName"
onMouseOut="window.status=''">Symantec20</a>

------------------------------------------------------

Thanks much,

Kevin


(e-mail address removed) (Kevin Lyons) wrote in message...
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Need help with change color of td and link 2
hiding URL in popup window title and status bars 4
php with javascript 7
I Need Help with making a function that draws in a canvas using location data. 1
variable from URL $_GET 1
Javascript / FireFox help needed 9
javascript in firefox fine but in IE it chokes on a long string?? 2
Mouseover - Image Change on MO 1

Members online

Total: 36 (members: 2, guests: 34)
Robots: 401

Forum statistics

Threads
473,770
Messages
2,569,584
Members
45,075
Latest member
MakersCBDBloodSupport

Latest Threads

Top