Mouse position to dynamic position

[craig]

I am trying to modify the following code so that I can Dynamically Position a linked photo.
Instead of having it be determined by by the mouse position.

Here is the part of the script that sends to the display area.
var mouseX, mouseY;
function positionTip(evt) {
if (!tipFollowMouse) {
mouseX = (ns4||ns5)? evt.pageX: window.event.clientX + document.body.scrollLeft;
mouseY = (ns4||ns5)? evt.pageY: window.event.clientY + document.body.scrollTop;
}
I have been trying to use this combination to dynamaically move the content for both browsers.
'width=400,height=200,
left=0,top=100,
screenX=0,screenY=100'

This part of the code resizes things to accomidate different browsers.
// tooltip width and height
var tpWd = (ns4)? tooltip.width: (ie4||ie5)? tooltip.clientWidth: tooltip.offsetWidth;
var tpHt = (ns4)? tooltip.height: (ie4||ie5)? tooltip.clientHeight: tooltip.offsetHeight;
// document area in view (subtract scrollbar width for ns)
var winWd = (ns4||ns5)? window.innerWidth-20+window.pageXOffset: document.body.clientWidth+document.body.scrollLeft;
var winHt = (ns4||ns5)? window.innerHeight-20+window.pageYOffset: document.body.clientHeight+document.body.scrollTop;
// check mouse position against tip and window dimensions
// and position the tooltip
if ((mouseX+offX+tpWd)>winWd)
tipcss.left = (ns4)? mouseX-(tpWd+offX): mouseX-(tpWd+offX)+"px";
else tipcss.left = (ns4)? mouseX+offX: mouseX+offX+"px";
if ((mouseY+offY+tpHt)>winHt)
tipcss.top = (ns4)? winHt-(tpHt+offY): winHt-(tpHt+offY)+"px";
else tipcss.top = (ns4)? mouseY+offY: mouseY+offY+"px";
if (!tipFollowMouse) t1=setTimeout("tipcss.visibility='visible'",100);
}

function hideTip() {
if (!tooltip) return;
t2=setTimeout("tipcss.visibility='hidden'",100);
tipOn = false;
}

These are the mouse over images on the left of the screen.

HTML Code:
<!-- 3 Frames- Home Page- Navigation- Works In IE AND Netscape-->
<div id="tipDiv" style="position:absolute; visibility:hidden; z-index:100"></div>
<DIV STYLE="position:absolute; top:240px; left:140px; width:165px; border-width:0; visibility: invisible; z-index:1">
<a href="#" onmouseover="doTooltip(event,0)" onmouseout="hideTip()"><img src="http://www.proamrodeo.com/jpg/jwcard.jpg"></img></a>
</DIV>
<DIV STYLE="position:absolute; top:320px; left:300px; width:165px; border-width:0; visibility: invisible; z-index:2">
<a href="#" onmouseover="doTooltip(event,1)" onmouseout="hideTip()"><img src="http://www.proamrodeo.com/jpg/sportsshot.jpg"></img></a><BR>
</DIV>
<DIV STYLE="position:absolute; top:390px; left:150px; width:165px; border-width:0; visibility: visible; z-index:1">
<a href="#" onmouseover="doTooltip(event,2)" onmouseout="hideTip()"><img src="http://www.proamrodeo.com/jpg/replay1.jpg"></img></a>
</DIV>

To view my site goto: www.proamrodeo.com

I am trying to get these images to display statically (Dynamically)
Instead of being controlled by the mouse position.
The resizing to accomidate different window dimensions is ok.
Just need to stick to the right of the mouseoverlinks.

[gorilla1]

Did you turn off mousemove as specified in the instructions that come with the script?: http://www.dynamicdrive.com/dynamici...agetooltip.htm

Not sure if I understand what you want to do exactly, but you could simply set up a div for the enlarged image absolutely positioned and make it hidden until mouseover event. You also might want to add intelligence so that indecisive mouse moves are ignored.

G