Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Mar 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    XY Coords and so much more

    I have a project where I need to be able to control four things onClick. I have a set of 12 arrows (3 colors, 4 directions) and I need to specify the XY coordinate of the arrow tip and I need to call the arrow by color and direction (instead of by src). Is this something that I can do with a 2d array?

    My Java looks like this:

    function ixycoord(i,x,y) {

    document.images["baseimage"].src = i;

    if (document.getElementById)
    {document.getElementById("baseimage").style.top = y;
    document.getElementById("baseimage").style.left = x} else

    if (document.layers)
    {document.baseimage.top = y; document.baseimage.left = x} else
    {document.all.baseimage.style.top = y; document.all.baseimage.style.left = x}
    }


    And the HTML looks like this:

    <div id="baseimage">
    <img id="baseimage" src="/arrowred.png">
    </div>

    <p>This is a the <a href="#n" onClick="ixycoord('whiteup.png',49,57)"> aorta</a>. This is the <a href="#n" onClick="ixycoord('blueleft.png',145,144)"> ventricle </a> and this is the <a href="#n" onClick="ixycoord('redright.png',220,230)">pericardium</a>. </p>


    I have to be able to make it *NOT* have the the image source in the onClick. Thanks in advance for any help you can give me!

  • #2
    New to the CF scene
    Join Date
    Feb 2012
    Location
    New York, NY
    Posts
    8
    Thanks
    1
    Thanked 0 Times in 0 Posts
    did you notice the id for the div and the img is the same??
    id is supposed to be unique

  • #3
    New to the CF scene
    Join Date
    Feb 2012
    Location
    New York, NY
    Posts
    8
    Thanks
    1
    Thanked 0 Times in 0 Posts
    change your div id to

    <div id="baseimagediv">

    and you're all set

  • #4
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,073
    Thanks
    38
    Thanked 498 Times in 492 Posts
    @jack_wookie

    Could you provide a link to the images so we could see the final product in action?

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,910
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    document.layers relates to Netscape4, which is one with Nineveh and Tyre.

    Quote Originally Posted by jack_wookie View Post
    My Java looks like this:
    Java and Javascript are entirely different programming languages, in spite of the confusingly similar names. Rather like Austria and Australia!
    Last edited by Philip M; 03-10-2012 at 07:53 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #6
    Banned
    Join Date
    Apr 2011
    Posts
    656
    Thanks
    14
    Thanked 69 Times in 69 Posts
    That's fairly straight forward, but need to see the images so we can see the location of the arrow tip.

  • #7
    New to the CF scene
    Join Date
    Mar 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I apparently wasn't clear enough. All of the arrows point to the correct spot. The code works just fine, everything does exactly as it is supposed to. The alternate arrows are stored in a folder and are successfully called and put in the correct place based on the XY coordinates. The code is fine.

    My problem is:

    My boss thinks it is too cumbersome to have to write the image name each time. That is he thinks, IXYcoords ("image.png", 345, 454) etc. is too cumbersome. Instead he wants four points (color, direction, x, y).

    So let's say we have 12 arrows labeled by (3) color and (4) direction.
    whiteup.png, bluedown.png, etc.

    I need to have the arrows called by (white, down, 384, 472). Can I do this with an array of some sort?

  • #8
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,073
    Thanks
    38
    Thanked 498 Times in 492 Posts

    Lightbulb

    Not sure I understand the need of an array...
    Add to JS
    Code:
    function pic(iColor, iDirection) { return iColor+iDirection+'.png'; }
    Change HTML
    Code:
    <p>
     This is a the <a href="#n" onClick="ixycoord(pic('white','up'),49,57)"> aorta</a>.
     This is the <a href="#n" onClick="ixycoord(pic('blue','left'),145,144)"> ventricle </a> and
     this is the <a href="#n" onClick="ixycoord(pic('red','right'),220,230)">pericardium</a>. 
    </p>


  •  

    Tags for this Thread

    Posting Permissions

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