Home     |     .Net Programming    |     cSharp Home    |     Sql Server Home    |     Javascript / Client Side Development     |     Ajax Programming

Ruby on Rails Development     |     Perl Programming     |     C Programming Language     |     C++ Programming     |     IT Jobs

Python Programming Language     |     Laptop Suggestions?    |     TCL Scripting     |     Fortran Programming     |     Scheme Programming Language


 
 
Cervo Technologies
The Right Source to Outsource

MS Dynamics CRM 3.0

Javascript / Client Side Development

Setting styles with JS


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
On May 15, 2:28 am, Mike <ampel@gmail.com> wrote:

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!
Mike wrote :

> Hello,
> I am trying to change the style(Position of an image) with a
> function.This code worked a month ago

Worked? In which browsers? In which browser versions?

and I dont know what I changed

> I'm only showing the relevant code.

That's not how serious debugging can be done, you see.
Not being able to see the whole code may prevent people from actually
figuring out your problem. Just posting an url would have been better, a
lot better.

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;

[snipped]

W3C DOM2 Reflection of an Element's CSS Positioning Properties

CSS 1 and CSS 2.x specifications require that non-zero values must be
specified with a length unit; otherwise, the css declaration will be
ignored. Mozilla-based browsers, MSIE 6+, Opera 7+ and other W3C
standards-compliant browsers enforce such handling of parsing error.
CSS 1 Forward-compatible parsing
http://www.w3.org/TR/REC-CSS1#forward-compatible-parsing
CSS 2.1 Rules for handling parsing errors
http://www.w3.org/TR/CSS21/syndata.html#parsing-errors

See section 3.3.1.2 of
Using Web Standards in your Web Pages
http://developer.mozilla.org/en/docs/Using_Web_Standards_in_your_Web_...

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

Mike, post an url. First make sure your markup code passes HTML
validation and make sure your CSS code is valid.

Grard
--
Using Web Standards in your Web Pages (Updated Apr. 2007)
http://developer.mozilla.org/en/docs/Using_Web_Standards_in_your_Web_...

> 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';

I want the "R" image superimposed on the Fretboard.And Relative to the
upper left corner on the fretboard

I want it to reposition when I click the "A" Link
http://www.ampsoft.com/Guitar/

Thanks
Mike

Add to del.icio.us | Digg this | Stumble it | Powered by Megasolutions Inc