Advertisement
Help Keep Boards Alive. Support us by going ad free today. See here: https://subscriptions.boards.ie/.
If we do not hit our goal we will be forced to close the site.

Current status: https://keepboardsalive.com/

Annual subs are best for most impact. If you are still undecided on going Ad Free - you can also donate using the Paypal Donate option. All contribution helps. Thank you.
https://www.boards.ie/group/1878-subscribers-forum

Private Group for paid up members of Boards.ie. Join the club.

JavaScript help

  • 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

  • #2
    egan007
    Registered Users, Registered Users 2 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


  • #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


  • #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!


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


    Pretty self righteous for someone who can't code.


  • #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
  • #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