Setting styles with JS

M

Mike

Hello,
I am trying to change the style(Position of an image) with a
function.This code worked a month ago and I dont know what I changed
I'm only showing the relevant code. One image is superimposed on
another.
From The html file:
--------------------------------------------------------------------
<script type="text/javascript">
function changenote(element) {

alert ("This Function is being Called");//Checking to see if the
function gets called, it does


var p = document.getElementById(element);
p.style.top =30;
p.style.left=30;

}

</script>

.......
<div id="GridBlock"><img alt="Blank Grid" src="crdgrid4.gif"
class="GridLayout" id="grid1" />
<img id="E"src="Root.gif" alt="none" class="Circle"
style="visibility:visible"></img>
<img id="A"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
<img id="D"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
<img id="G"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
<img id="B"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
<img id="e"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
</div>

..........

<td id="NoteA" width="22" class="Cellstyle"
onclick="changenote('E')"><a href="">A</a></td>

----------------------------------------------------------------------------
From the Css:
..Circle {
position: absolute;

top: 63px;
left: 20px;
}

I am trying to change the position of "Root.gif" when I click the link
in the cell with id+"NoteA".
But nothing is changing.
Thanks
Mike
 
S

shimmyshack

Hello,
I am trying to change the style(Position of an image) with a
function.This code worked a month ago and I dont know what I changed
I'm only showing the relevant code. One image is superimposed on
another.>From The html file:

--------------------------------------------------------------------
<script type="text/javascript">
function changenote(element) {

alert ("This Function is being Called");//Checking to see if the
function gets called, it does

var p = document.getElementById(element);
p.style.top =30;
p.style.left=30;

}

</script>

......
<div id="GridBlock"><img alt="Blank Grid" src="crdgrid4.gif"
class="GridLayout" id="grid1" />
<img id="E"src="Root.gif" alt="none" class="Circle"
style="visibility:visible"></img>
<img id="A"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
<img id="D"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
<img id="G"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
<img id="B"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
<img id="e"src="Root.gif" alt="none" class="Circle"
style="visibility:hidden"></img>
</div>

.........

<td id="NoteA" width="22" class="Cellstyle"
onclick="changenote('E')"><a href="">A</a></td>

---------------------------------------------------------------------------->From the Css:

.Circle {
position: absolute;

top: 63px;
left: 20px;

}

I am trying to change the position of "Root.gif" when I click the link
in the cell with id+"NoteA".
But nothing is changing.
Thanks
Mike

that is the worst piece of code i've seen in a long while.
add a return false statement, so from

<td id="NoteA" width="22" class="Cellstyle"
onclick="changenote('E')"><a href="">A</a></td>

to

<td id="NoteA" width="22" class="Cellstyle"
<a onclick="changenote('E');return false;" href="">A</a></td>

but seriously, that's all i'm going to say!
 
P

Pete

So, here the correct js code must be
p.style.top = "30px";

Another option would be to work with a class rather than individual
style elements.

p.className = 'newclass';
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,482
Members
44,900
Latest member
Nell636132

Latest Threads

Top