JavaScript Style ID

Hello,

I am trying to make my JavaScript identify an inline style and then style two other elements based on that, here is what I have so far:

Start JavaScript
id=nice1 if style = display: inline;
then
id=nice2 style = display: none;
id=nice3 style = height: 500;
else
id=nice1 if style = display: none;
then
id=nice2 style = display: inline;
id=nice3 style = height:  800;
End

Not sure why my JavaScript I made is not working, but I would love some help making it work.
Richard MorrisAsked:
Who is Participating?
 
leakim971PluritechnicianCommented:
== is to compare
= is to assign
there's a mistake, please locate the changes
window.onload = function() {
    var nice1 = document.getElementById("nice1");
    if(nice1.style.display=="inline")          
    {
        document.getElementById("nice2").style.display="none";
        document.getElementById("nice3").style.height="500px";
    }
    else if(nice1.style.display=="none")        
    {
        document.getElementById("nice2").style.display="inline";
        document.getElementById("nice3").style.height="800px";
    }
} 

Open in new window

0
 
leakim971PluritechnicianCommented:
why don't you post your true javascript? and the content of your page?
0
 
Richard MorrisAuthor Commented:
This is my true JavaScript, I wrote it myself.

Here is a sample page:

<html>
<head>

Start JavaScript
id=nice1 if style = display: inline;
then
id=nice2 style = display: none;
id=nice3 style = height: 500;
else
id=nice1 if style = display: none;
then
id=nice2 style = display: inline;
id=nice3 style = height:  800;
End

</head>
<body>

<div id="nice1" style="display: inline;">text</div>

<div id="nice2">text</div>

<iframe id="nice3">text</iframe>

</body>
</html>

As you can see I almost have it but can't figure out why it isn't working yet?

I just want to control ids nice2 and nice3 based on the inline style of id nice1.

Example:

if id nice1 is display: inline then id nice2 style display: none id nice3 style height: 500

if id nice1 is display: none then id nice2 style display: inline id nice3 style height: 800
0
Cloud Class® Course: Microsoft Windows 7 Basic

This introductory course to Windows 7 environment will teach you about working with the Windows operating system. You will learn about basic functions including start menu; the desktop; managing files, folders, and libraries.

 
leakim971PluritechnicianCommented:
try to do the work with the following : http://jsfiddle.net/CPRYs/
0
 
leakim971PluritechnicianCommented:
//Start JavaScript
window.onload = function() {
//id=nice1 if style = display: inline;
    var nice1 = document.getElementById("nice1");
    if(nice1.style.display=="inline")          
//then
    {
//id=nice2 style = display: none;
        document.getElementById("nice2").style.display=="none";
//id=nice3 style = height: 500;
        document.getElementById("nice2").style.height=="500px";
//else
    }
//id=nice1 if style = display: none;
    else if(nice1.style.display=="none")        
//then
    {
//id=nice2 style = display: inline;
        document.getElementById("nice2").style.display=="inline";
//id=nice3 style = height:  800;
        document.getElementById("nice2").style.height=="800px";
//End
    }
}

Open in new window

¿
0
 
Richard MorrisAuthor Commented:
Still doesn't work for me, here is what I have so far:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>

<script type="text/javascript">
window.onload = function() {
    var nice1 = document.getElementById("nice1");
    if(nice1.style.display=="inline")          
    {
        document.getElementById("nice2").style.display=="none";
        document.getElementById("nice3").style.height=="500px";
    }
    else if(nice1.style.display=="none")        
    {
        document.getElementById("nice2").style.display=="inline";
        document.getElementById("nice3").style.height=="800px";
    }
} 
</script>

</head>
<body>

<div id="nice1" style="display: inline;">text</div>

<div id="nice2">text</div>

<iframe id="nice3">text</iframe>

</body>
</html>

Open in new window

0
 
jrm213jrm213Commented:
Just going from what you posted in your last post, when you make an assignment you only want a single =, == is for comparison.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>

<script type="text/javascript">
window.onload = function() {
    var nice1 = document.getElementById("nice1");
    if(nice1.style.display=="inline")          
    {
        document.getElementById("nice2").style.display="none";
        document.getElementById("nice3").style.height="500px";
    }
    else if(nice1.style.display=="none")        
    {
        document.getElementById("nice2").style.display="inline";
        document.getElementById("nice3").style.height="800px";
    }
} 
</script>

</head>
<body>

<div id="nice1" style="display: inline;">text</div>

<div id="nice2">text</div>

<iframe id="nice3">text</iframe>

</body>
</html>

Open in new window


if that fixes it, please give the points to leakim971
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.