JavaScript help

El_mariachi · 18-01-2008 10:24am #1

Fairly new to javascript and would be fairly grateful to anyone who can help,
I spent a few hours yesterday trying to do it but I don't know the syntax well enough

Basically here is what i want to do

<html>
<head>
<style type="text/css">
div.div1
{
visibility: visible;
}
div.div2
{
 visibility: hidden;
}

</style>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<input type="button" value="Show div 1" >
<input type="button" value="Show div 2" >

        
<div id="main" class="main">
                                    <div id="div1" class="div1">
                                    this is my section 1
                                     </div>
                                    <div id="div2" class="div2">
                                    this is my section 2
                                     </div>
</div>
</body>
</html>

so i want when a person clicks button 2, div 1 will disappear and div 2 will be visible then if button 1 is pressed, div one will be shown and div 2 will disappear.

Any ideas?

ps. if you could explain what your doing so i could learn it would be helpful

egan007 · 18-01-2008 10:29am

Fairly new - Very new to javascript i'd say

First you have your script tags as style tags.

<style type="text/css"> </style> is for css. Not javascript

<script type="text/javascript"> </script> is for Javascript.

Second you have invented a new language which is a mix of CSS and Javascript.

There is so much wrong with the rest that you are better off just download an example of a javascript and an example of a css page to see the difference.

http://www.webmasterworld.com/forum91/441.htm

http://www.google.ie/search?hl=en&sa=X&oi=spell&resnum=0&ct=result&cd=1&q=javascript+hide+div&spell=1

ron_darrell · 18-01-2008 11:11am

You caught me on a generous day so this had better not be an assignment or I'll get in trouble

<html>
<head>
<script>
function show_div(show_div, hide_div)
{
divData1 = document.getElementById(show_div).style;
divData2 = document.getElementById(hide_div).style;

divData1.display = "block";
divData2.display = "none";
}
</script>
</head>
<body>
<div id="container">
<div id="div1" style="background-color:red;display:block;">
Hello from div 1
</div>
<div id="div2" style="background-color:darkgreen;display:none;">
Hello from div 2
</div>
<br />
<span><button onclick="show_div('div1', 'div2')">Show Div 1</button><button onclick="show_div('div2', 'div1')>Show Div 2</button></span>
</div>
</body>
</html>

Enjoy
-RD

El_mariachi · 18-01-2008 2:40pm

egan007 wrote: »

Fairly new - Very new to javascript i'd say

First you have your script tags as style tags.

<style type="text/css"> </style> is for css. Not javascript

<script type="text/javascript"> </script> is for Javascript.

Second you have invented a new language which is a mix of CSS and Javascript.

There is so much wrong with the rest that you are better off just download an example of a javascript and an example of a css page to see the difference.

Thanks for letting me know this is for CSS <style type="text/css"> Clearly if you look at the next bit IT IS CSS :rolleyes: There was no javascript in that code at all........ :rolleyes: Hence why i asked for help with writing the javascript.

So next time read it correctly then offer your pearls of wisdom

To ron darrell :

thanks you so much, it worked a charm, Just played around with it abit to see how it works and is by far the best way i have seen it done so far! dont worry its not for anything other than personal interest on how its done, I only ever used javascript for validation so far so I always wondered how they did that

Thanks again!

egan007 · 19-01-2008 11:48am

Pretty self righteous for someone who can't code.

ron_darrell · 19-01-2008 7:01pm

LMAO @ egan - cruel but true. With respect OP might be an idea to take a javascript course of some sort. Try http://www.w3schools.com/js/ for a good reference to jscript functions

-RD

PS: Don't be sore Egan - it's only for sh*ts & giggles

El_mariachi · 19-01-2008 7:33pm

egan007 wrote: »

Pretty self righteous for someone who can't code.

Aw poor you , he's all cranky because i can see the difference between <style type="text/css"> </style> and this <script type="text/javascript"> </script> in the context of my code but he cant! :rolleyes: (and I'm new to all this) but you'll get over it I'm sure.

@Ron ,

thanks man, I will have a look, not big into coding yet like i said validation with Javascript was all I looked into and it was easy but i want to learn more, its just a hobby at the moment.

JavaScript help

Comments