Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4
  1. #1
    Junior Member
    Join Date
    Jan 2006
    Posts
    1
    Member #
    12307
    Hello, I have a bit of a problem trying to work something out. I have an image with a map on it, what i'm trying to achieve is a div appears exactly where someone clicks the map.

    Code:
    <area name="whatever" onClick="javascript:document.all.whatever.class.display='block'">
    
    <div id="whatever" style="display:none;">
    <h2>HI</h2>
    </div>
    I'm using something similar to the above, but nothing happens on the click.

  2.  

  3. #2
    Senior Member straight_up's Avatar
    Join Date
    Dec 2003
    Location
    Pennsylvania/Arizona
    Posts
    601
    Member #
    4309
    You'll need to position (absolute) the div, too, using Javascript, most likely, if I understand you correctly.

    I don't have any experience with which to help you.

    But i recommend reading up on how to detect click locations using JS... Hit up quirksmode.org! It's the only good JS site I've seen, ever.

    If your div should always show up in a certain place, i.e. not exactly where the user's cursor is, you can position it with CSS/XHTML and then just show/hide it, like your code above does.

    HTH
    I am Alan Hogan (@alanhogan on Twitter). I like PHP, UI/UX design, and OS X.

  4. #3
    Senior Member straight_up's Avatar
    Join Date
    Dec 2003
    Location
    Pennsylvania/Arizona
    Posts
    601
    Member #
    4309
    Also, you need to use a function like this to get an element, otherwise it won't work in some IE versions or else won't work in Firefox.

    Code:
    function getById(id) //Thanks to - but not by - PPK @ quirksmode.org
    { 
      var x=0;
        if (document.getElementById) //Modern W3C DOM
        {
            x = document.getElementById(id);
        return x;
        }
        else if (document.all) //IE
        {
            x = document.all[id];
            return x;
        } else return false;
    }
    I pretty much wrote that with help from quirksmode.org and release it in public domain. i.e. use it freely :-)
    I am Alan Hogan (@alanhogan on Twitter). I like PHP, UI/UX design, and OS X.

  5. #4
    Senior Member straight_up's Avatar
    Join Date
    Dec 2003
    Location
    Pennsylvania/Arizona
    Posts
    601
    Member #
    4309
    ooh from quirksmode.org --- this might or might not help:

    Code:
    function doSomething(e)
    {
    	var posx = 0;
    	var posy = 0;
    	if (!e) var e = window.event;
    	if (e.pageX || e.pageY)
    	{
    		posx = e.pageX;
    		posy = e.pageY;
    	}
    	else if (e.clientX || e.clientY)
    	{
    		posx = e.clientX + document.body.scrollLeft;
    		posy = e.clientY + document.body.scrollTop;
    	}
    	// posx and posy contain the mouse position relative to the document
    	// Do something with this information
    }
    I am Alan Hogan (@alanhogan on Twitter). I like PHP, UI/UX design, and OS X.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 03:42 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com