Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

JavaScript help

Options
  • 18-01-2008 11:24am
    #1
    El_mariachi
    Closed Accounts Posts: 381 ✭✭


    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 :)


Comments

  • Options
    #2
    egan007
    Registered Users Posts: 2,934 ✭✭✭egan007


    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


  • Options
    #3
    ron_darrell
    Users Awaiting Email Confirmation Posts: 351 ✭✭ron_darrell


    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


  • Options
    #4
    El_mariachi
    Closed Accounts Posts: 381 ✭✭El_mariachi


    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!


  • Options
    #5
    egan007
    Registered Users Posts: 2,934 ✭✭✭egan007


    Pretty self righteous for someone who can't code.


  • Options
    #6
    ron_darrell
    Users Awaiting Email Confirmation Posts: 351 ✭✭ron_darrell


    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 :)


  • Advertisement
  • Options
    #7
    El_mariachi
    Closed Accounts Posts: 381 ✭✭El_mariachi


    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.


This discussion has been closed.
Advertisement