有没有办法在不添加类的情况下在 js 中添加过渡效果（平滑/缓和）？

Question

Si I have a simple few lines of code, basically what it does is when you click on the div that has the id, it disappear (display :none). Normally I would do an addClass / removeClass but I was wondering if just with this code I could add an effect that doesn't make the div brutally disappear but maybe with a transition to the left or the top with 0.8 seconds. How would you proceed?

window.onload = function(){
    var divToHide = document.getElementById('divToHide');
    document.onclick = function(e){
        divToHide.style.display = 'none';
      }
  };

Answer 1

If you want to use jquery, you can use slide methods of the same. Constraint is that you will have to use jquery.

$("#divToHide").slideDown(2000); //2000 is the ms for the effect

However you can also apply transition-timing-function in css. If you keep the transition-timing-function: linear and go from width 100% to zero width, it will have the effect of sliding and from to to bottom, transition on height.. https://developer.mozilla.org/en-US/docs/Web/CSS/transition-timing-function