-1

how can I add a slide effect to show my hidden div ? 

   function show() {
    var x = document.getElementById("info");
    if (x.style.display === "none") {
        x.style.display = "block";
    } else {
        x.style.display = "none";
    }
 }
<a onclick="show()"> Test </a>

<div id="info" style="display:none;">
   <a href="" >1111111111111111111111111111111</a>
</div>

Thank you by advance.

Gilles Hayibor
  • 21
  • 2
  • 5
    You can use CSS transitions, jQuery animations, or write your own plain vanilla JavaScript code to loop and change the position of the div. However I see no attempt on your part to accomplish this. – j08691 Apr 09 '18 at 14:03
  • https://stackoverflow.com/questions/40446658/javascript-add-transition-between-displaynone-and-displayblock – Frank Groot Apr 09 '18 at 14:06
  • 1
    Possible duplicate of [JavaScript - add transition between display:none and display:block](https://stackoverflow.com/questions/40446658/javascript-add-transition-between-displaynone-and-displayblock) – Calvin Nunes Apr 09 '18 at 14:07
  • Post the CSS you have tried – Jonny Apr 09 '18 at 14:48

1 Answers1

1

I found a way to do this with jquery 3.3.1 :

$(document).ready(function(){
   $("#show").click(function(){
    $("#info").toggle(300);
   });
  });
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<a href="#" id="show">SHOW HIDDEN DIV</a>

<div id="info" style="display:none;">I WAS HIDDEN</div>
Gilles Hayibor
  • 21
  • 2