-1

(question reposted because got partly-erased accidentally and can't edit it)

I have two pictures, one of a wheel and another of an arrow. I want to position the arrow so it will point down on the wheel.

In my body part I defined:

function g1()
{
  var left1=screen.width/2;
  var tikli=document.getElementById("arrow");
  //tikli.style.right=0;
  //tikli.style.top=0;
  tikli.style.right=left1;
  tikli.style.top=left1;
  tikli.style.zIndex+=2;
  //rotateAnimation("wheel",8,710);
}
<body onload="g1()">
    <img src="arrow.png" id="arrow" width=8%>
    <br>
    <center>
    <img src="wheel.png" id="wheel">
    <br>
    <h2 style="width:200px;" id="status"></h2>
    </center>
</body>

Now the problem is, while the values of .style.right and .style.top are being updated, the arrow's position isn't. (I found out they are updated by inserting alerts in between).

Am I missing something in here? For the record, I tried it both in Chrome and in IE, and the arrow still doesn't move.

(ps. uploaded the pics to here )

Edit: Attaching CSS script:

<style type="text/css">
        body{
            //font-size:22px;
        }
        #arrow{
            position:absolute;
            bottom:100px;
            right:500px;
        }
</script>
5
  • You can edit your old post. Unless the post is locked, you can always edit your post.
    – gunr2171
    Sep 19, 2014 at 15:12
  • where is screen defined? Sep 19, 2014 at 15:13
  • @SterlingArcher it's the screen's width, see: w3schools.com/jsref/prop_screen_width.asp
    – user2478971
    Sep 19, 2014 at 15:14
  • Please include any relevant css. top and right are only applicable to positioned elements. Are these elements positioned (e.g. position: absolute) Sep 19, 2014 at 15:14
  • @JamesMontagne absolute, attached the css.
    – user2478971
    Sep 24, 2014 at 12:40

1 Answer 1

0

You're forgetting your units. Modern browsers will often not assume you're talking about pixels, and just ignore styles that don't have a unit associated with them.

The logical exception is 0 which means the same regardless of what your units are.

function g1()
{
  // ...
  tikli.style.right=left1+'px';
  tikli.style.top=left1+'px';
  // ...
}
1
  • 1
    Already tried this, but no change.
    – user2478971
    Sep 24, 2014 at 12:33