Click here to Skip to main content
12,750,191 members (35,780 online)
Rate this:
Please Sign up or sign in to vote.
See more: Javascript
<script type="text/javascript">
function winopen(e,linkid)
      MessageWin=eval(',"newwin",config="width=200,height=100,location=no,status=no,directories=no,toolbar=no,scrollbars=no,menubar=no,resiza ble=no,top='+toppos+',left='+leftpos+'")');

<a href="#" onMouseOver="winopen(event,'Default2.aspx')"  önMouseOut="MessageWin.close()">Open Window</a>

here is my code to open a new window on mouse over and close the windows when mouse out. it working fine at google chrome, but have 1 small problem with IE with windows 7.

if the new windows open at the center of my mouse cursor, the browser read it as 'onMouseOut', so what happend here is the new windows keep open and close. how to solve this?

var time;

function chkFocus(){

   time = setTimeout(function(){






}, 100);

and set my onmouseover="chkFocus()";
well, problem still the same, i believe we almost solve the problem. i put timeout as '100' because i want it to be closed instantely when mouseout.
Posted 13-Nov-12 19:55pm
Updated 13-Nov-12 23:14pm
Pro Idiot 14-Nov-12 2:49am
"here is my code to open a new window on mouse over and close the windows when mouse out. it working fine at google chrome, but have 1 small problem with IE with windows 7.

In chrome , the window keeps opened, does not close on mouse out !
melvintcs 14-Nov-12 2:53am
check ur first "o" at onMouseOut...
Pro Idiot 14-Nov-12 3:07am
yes, got it , Now it is working fine for me on Chrome and IE-8
the new window is closing on mouseout , perfectly fine !
Pro Idiot 14-Nov-12 3:12am
or you can change the value

10 to 20/30 as per your requirement , so the new window will never overlap on the mouse
melvintcs 14-Nov-12 3:19am
i having the problem is the link is at the bottom right.
Pro Idiot 14-Nov-12 3:26am
Try with " toppos=toppos+30"

It is working fine, even on bottom right.
melvintcs 14-Nov-12 3:29am
i tried, still the same, how u do the testing? u try to resize the window, and drag the whole parent window until the link is at the bottom right of your screen and try again. it do fine at windows XP, but having problem with windows 7
n.podbielski 14-Nov-12 4:50am
Do you have to open a new window? Can't you do something like popup div, or toolpip? It is better solution since you have complete control of it.
melvintcs 14-Nov-12 18:59pm
yes, tooltip or popup div also will do
Rate this: bad
Please Sign up or sign in to vote.

Solution 1

You can use:[^]
Set position of dialog to someplace not over your link and close dialog on mouseout.

Or maybe tooltip? It seems nice for hovering over link.[^]

I am not sure what you want to show in those windows. If you want show some info about website from link maybe this will help you?[^]
It's creates some nice thumbs of websites. Should work great with tooltip and you could cache those images.

I founding jQuery UI somewhat slow so you could investigate some other libraries or even roll out something on your own.

Check dojo to:[^][^]

I bet it is even slower then jQuery. But it is even prettier then jQuery UI :)
melvintcs 14-Nov-12 22:07pm
thx, ur links might help others, but i come with my own solution :)
n.podbielski 15-Nov-12 2:03am
Rate this: bad
Please Sign up or sign in to vote.

Solution 2

this is how i solve it:
var scrWidth = window.screen.width;
var scrheight = window.screen.height;

var widthPercent = event.screenX / scrWidth * 100
var heightPercent = event.screenY / scrHeight * 100




if(widthPercent > 70){
   leftpos = leftpos * 0.7

if(heightPercent > 70){
   toppos = toppos * 0.7

by doing this, the new windows will appear at left hand side if my cursor is at the bottom right. simple but efficient :)

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

    Print Answers RSS
Top Experts
Last 24hrsThis month

Advertise | Privacy | Mobile
Web02 | 2.8.170215.1 | Last Updated 14 Nov 2012
Copyright © CodeProject, 1999-2017
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100