SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Member
    Join Date
    Apr 2008
    Location
    Manila, Philippines
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    mouse away window

    hi to all,
    can anyone knows how to find/make a javascript that makes a popupwindow and it moves away from the mouse. e.g. when i try to point the mouse on the window will avoid the mouse.

    im new to javascript and im making a games for my brother.

    anyone please.

    thanks

  2. #2
    SitePoint Addict
    Join Date
    Dec 2007
    Posts
    358
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Maybe using DIV with absolute positioning is better for your task. For example, this example will show something like what you have asked:

    Code:
    <html>
    <head>
    <style type="text/css">
    #flying-box {
    	width: 50px;
    	height: 50px;
    	background: red;
    	position: absolute;
    }
    </style>
    <script type="text/javascript">
    document.onmousemove = function () {
    	var box = document.getElementById('flying-box');
    	box.innerHTML = 'x: ' + event.x + ' y: ' + event.y;
    	box.style.left = (event.x + 10) + 'px';
    	box.style.top = (event.y + 10) + 'px';
    };
    </script>
    </head>
    <body>
    <div id="flying-box"></div>
    </body>
    </html>
    I'm creating trouble-free Apache, PHP, MySQL installer, WITSuite,
    and use it to setup my development environment.
    Demo, support, contact. Questions?

  3. #3
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,875
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    You can't do it with a separate browser window because the web page can only track where the mouse is in the page not where the mouse is on the screen.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  4. #4
    SitePoint Member
    Join Date
    Apr 2008
    Location
    Manila, Philippines
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks for the reply,
    the code is good,
    but i want this script in a popup window, when a page loaded, a pop up window appears and the popup window will avoid the mouse,or the popup window will run away from the mouse.
    can i put a popup window inside the div?

    thanks to all.

  5. #5
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,875
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    You can't put a popup window inside a web page - it needs to be separate. JavaScript can only interact with the web page it is in and so cannot affect the popup window's position after that popup opens.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  6. #6
    SitePoint Member
    Join Date
    Apr 2008
    Location
    Manila, Philippines
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    how can i make the popup window avoid the mouse?
    can i use the script above?

    thanks

  7. #7
    SitePoint Addict
    Join Date
    Dec 2007
    Posts
    358
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You cannot!
    Do you think it should be possible to malicious web pages open a window on your desktop with tons of viarga and you cannot close it because it is avoiding the mouse?? :-D
    I'm creating trouble-free Apache, PHP, MySQL installer, WITSuite,
    and use it to setup my development environment.
    Demo, support, contact. Questions?

  8. #8
    SitePoint Member
    Join Date
    Apr 2008
    Location
    Manila, Philippines
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    youre right,
    so i cant make my mini games work.

  9. #9
    SitePoint Member
    Join Date
    Jul 2004
    Location
    us
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Take a look at: http://code.google.com/p/xssinterface/
    This allows cross-window communication using window.postMessage() in supporting browser and cookies in older browsers: http://developer.mozilla.org/en/docs...ow.postMessage

    That could be used to move the popup window.

    The window would have to remain in the "document" portion of the parent window in order for the parent to keep track of the mouse position and move the popup.

    Here is an explanation on getting windows to talk to each other:
    http://onwebdevelopment.blogspot.com...unication.html

    Since you're working with a popup (for which you have a reference) its easier to command it to execute JavaScript command, either using cookies, or any medium both the parent and child can read and write to.
    In Firefox, you could write to a property accessible from the child window and have it read immediately using the Object.watch() method. Otherwise, you'd need to "poll" the medium.

    It may be a bit much for the simple thing you're trying to do.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •