Home/ Questions/Q 7024653
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T23:52:11+00:00

Hi friends I have issue with divs. I have a link show/hide dive on

  • 0

Hi friends I have issue with divs.
I have a link show/hide dive on my page on clicking which i have to show or hide specific divs.
I am successful with doing it.
But my issue is that whenever I click on that link div is get hide or shown but page get directly on the top & I have to scroll to down again.
I don’t want to scroll this and don’t want to get to top.

Please help me out with this.
Thank You in advance.

Update:
Friend I got the answer from one of my friend.
Actually I was using
Because of href=”#” URL get changed and page got to top every time I click on that link.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Are you trying to do this?

    <!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <meta charset="utf-8">
</head>
<body>

    <div id="wrapper">
        <div id="container">

        </div><!-- end of #container div -->

        <a id="showdiv">Show the div</a>|<a id="hideDiv">Hide the div</a>|<a id="toggle">Toggle</a>

    </div><!-- end of #wrapper div -->

</body>
</html>

    Here’s the css:

    #container {
 width: 300px;
  height: 300px;
   background: red; 
    margin-bottom: 20px;
}

#wrapper {
 margin: 40px auto;
 width: 400px;
}

    And here’s the jquery

    $(function() {// When document is ready, run this...

//Get hold of the link with the id #showdiv and do something when you click it
$("#showdiv").click(function() {
    // Grab the div with the id #container and show it
    // Alert me when you're done
    $("#container").show(2000, function() {
        alert("I'm done showing");
    });
});

//Get hold of the link with the id #hideDiv and do something when you click it
$("#hideDiv").click(function() {
    // Grab the div with the id #container and hide it
    // Alert me when you're done
    $("#container").hide(2000, function() {
        alert("I'm done hiding");
    });

});

// Toggle - This is like a On/Off Switch
//Get hold of the link with the id #toggle and do something when you click it
$("#toggle").click(function() {
    // Grab the div with the id #container and show if hidden / hide if shown
    $("#container").toggle(2000);
});

});

    Of course you’d have to link to a copy of jQuery before using the script above.
    Here’s a link to a demo: http://jsfiddle.net/tonystark/HhNBA/

    • 0