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:ope nWindow('http://www.symantec.co m/');' 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:unde rline;
color:blue;}a:v isited{text-decoration:unde rline; color:blue;}a:h over
{text-decoration:unde rline; color:red;}a:ac tive
{text-decoration:unde rline; color:blue;}</style>
<script language="JavaS cript">
function openWindow(URL) {
var availWidth = screen.availWid th + 1;
var availHeight = screen.availHei ght;
var x = 0, y = 0;
if (document.all) {
x = window.screenTo p;
y = window.screenLe ft;
}
else if (document.layer s) {
x = window.screenX;
y = window.screenY;
availWidth = availWidth - 11;
availHeight = availHeight - 155;
}
var arguments =
'resizable=yes, toolbar=yes,loc ation=yes,direc tories=yes,addr essbar=yes,scro llbars=yes,stat us=yes,menubar= yes,top=0,left= 0,screenX='+x+' ,screenY='+y+', width='+availWi dth+',height='+ availHeight;
var newWindow = window.open(URL ,'_blank',argum ents);
}
</script>
</head>
<body marginwidth="0" marginheight="0 " leftmargin="0" topmargin="0"
text="#333333" link="#336699" vlink="#336699"
alink="#990033" bgcolor="#99999 9">
<center>
<table>
<tr>
<td>
<b>First Scenario</b>
<a href="JavaScrip t:openWindow('h ttp://www.symantec.co m/');"
onMouseOver="wi ndow.status='Sy mantec Corporation';
return true;" onMouseDown="wi ndow.status='Sy mantec Corporation';
return true;" onMouseOut="win dow.status=''; return
true;"><img src="http://www.symantec.co m/images/downloads/product_shot.gi f"></a>
<a href="JavaScrip t:openWindow('h ttp://www.symantec.co m/');"
onMouseOver="wi ndow.status='Sy mantec Corporation';
return true;" onMouseDown="wi ndow.status='Sy mantec Corporation';
return true;" onMouseOut="win dow.status=''; return
true;">Symantec 1</a>
</td><td> &n bsp;</td><td>
<b>Second Scenario</b>
<a onMouseOver="wi ndow.status='Sy mantec Corporation'; return true;"
onMouseOut="win dow.status='Sym antec
Corporation'; return true;" onMouseDown="wi ndow.status='Sy mantec
Corporation'; return true;"
onClick="openWi ndow('http://www.symantec.co m/');"><img
src="http://www.symantec.co m/images/downloads/product_shot.gi f"></a>
<a onMouseOver="wi ndow.status='Sy mantec Corporation'; return true;"
onMouseOut="win dow.status='Sym antec
Corporation'; return true;" onMouseDown="wi ndow.status='Sy mantec
Corporation'; return true;"
onClick="openWi ndow('http://www.symantec.co m/');">Symantec2 </a>
</td><td> &n bsp;</td><td>
<b>Third Scenario</b>
<a onMouseOver="wi ndow.status='Sy mantec Corporation'; return true;"
onMouseOut="win dow.status=''; return true;"
onMouseDown="wi ndow.status='Sy mantec Corporation'; return true;"
onClick="openWi ndow('http://www.symantec.co m/');"
style="cursor:h and"><img
src="http://www.symantec.co m/images/downloads/product_shot.gi f"></a>
<a onMouseOver="wi ndow.status='Sy mantec Corporation'; return true;"
onMouseOut="win dow.status=''; return true;"
onMouseDown="wi ndow.status='Sy mantec Corporation'; return true;"
onClick="openWi ndow('http://www.symantec.co m/');"
style="cursor:h and">Symantec3 </a>
</td></tr>
<tr><td><b>Four th Scenario</b>
<a href="" onMouseOver="wi ndow.status='Sy mantec Corporation'; return
true;" onMouseOut="win dow.status=''; return
true;" onMouseDown="wi ndow.status='Sy mantec Corporation'; return
true;"
onClick="openWi ndow('http://www.symantec.co m/'); return true;"
style="cursor:h and"><img
src="http://www.symantec.co m/images/downloads/product_shot.gi f"></a>
<a href="" onMouseOver="wi ndow.status='Sy mantec Corporation'; return
true;" onMouseOut="win dow.status=''; return
true;" onMouseDown="wi ndow.status='Sy mantec Corporation'; return
true;"
onClick="openWi ndow('http://www.symantec.co m/'); return true;"
style="cursor:h and">Symantec4 </a>
</td><td> &n bsp;</td><td>
<b>Fifth Scenario</b>
<a href="#" style="text-decoration: none; cursor: default;"
onClick="return false;" onMouseOver="wi ndow.status=' ';return
true;"><img src="http://www.symantec.co m/images/downloads/product_shot.gi f"></a>
<a href="#" style="text-decoration: none; cursor: default;"
onClick="return false;" onMouseOver="wi ndow.status=' ';return
true;">Symantec 5</a>
</td><td> &n bsp;</td><td>
<b>Sixth Scenario</b>
<a onMouseOver="wi ndow.status='Sy mantec Corporation'; return true;"
onMouseOut="win dow.status=''; return true;"
onMouseDown="wi ndow.status='Sy mantec Corporation'; return true;"
onClick="openWi ndow('http://www.symantec.co m/');" style="a:link
{text-decoration:unde rline; color:blue;}
a:visited{text-decoration:unde rline; color:blue;} a:hover
{text-decoration:unde rline; color:red;} a:active
{text-decoration:unde rline; color:blue;}">< img
src="http://www.symantec.co m/images/downloads/product_shot.gi f"></a>
<a onMouseOver="wi ndow.status='Sy mantec Corporation'; return true;"
onMouseOut="win dow.status=''; return true;"
onMouseDown="wi ndow.status='Sy mantec Corporation'; return true;"
onClick="openWi ndow('http://www.symantec.co m/');" style="a:link
{text-decoration:unde rline; color:blue;}
a:visited{text-decoration:unde rline; color:blue;} a:hover
{text-decoration:unde rline; color:red;} a:active
{text-decoration:unde rline; color:blue;}">S ymantec6</a>
</td>
</tr>
</table>
</body>
</html>