I want to make a like this example. Cliking at any question it shows the whole, and clicking for the second time it hides. I want this effect.

http://mentor.templates.pixelentity.com/faq.html

Is there any code snippets for that. I need the code. WHAT IS THE NAME OF THIS EFFECT?

Help!

Jahur

u can use this i try to do it for you i hope it works

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
        /*this is the style for formation the other div */
        .format {/*this class is for the div that contents the banner for clicking*/
            width: 200px;
            height: 20px;
            background-color: black;
            text-align: center;
            color: white;
            cursor: pointer;
        }
        .top_div {/*this class is for the div that contents all the question */
            width:200px;

            margin: 20px;
        }
       /*this style is only used when you want the default to be hidden 
           comment it out you want to default to be display*/
       .con{
           height: 0px;
           overflow: hidden;
       }
    </style>
    <script>
        //this is the function that hid and show the questions 
        openCon = function () {
            if (document.getElementById("con_div").style.overflow != "hidden") {
                document.getElementById("con_div").style.overflow = "hidden";
                document.getElementById("con_div").style.height = "0px";
            }
            else {
                document.getElementById("con_div").style.overflow = "visible";
                document.getElementById("con_div").style.height = "auto";
            }
            }

    </script>
</head>
<body>
    <div id ="to_div" class ="top_div"><!-- div containing all the question-->
        <div id ="head" class ="format" onclick ="openCon(); " ><!--div containing the clicking part-->
            <p>click to show hidden content</p>
        </div><!-- End of div containing the clicking part-->
        <div id ="con_div" class="con"><!--div containing content to be hidden-->
            <p> all the text that you want it to show when the icon is clicked os let go 
                .duojhsldfje ptj lfkgndlfgndsfjsldkrjweo oejted
                jdsfdsjgore helfk;jndsgjge
                jdfsdogheorghnfh
            </p>
        </div><!-- End of div containing content to be hidden-->
    </div>
    <div><!-- End of div containing all the question-->
        <p>Other content</p>
    </div>
    <!-- By Oteng Ghana -->
</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.