0

I want to change the bottom property of an element.
I want it to have different delays on bottom increase and decrease, but if I set:

 transition-property: bottom;
        transition-delay: 0.3s;
        -moz-transition-delay: 0.3s;
        -webkit-transition-delay: 0.3s;

The js code:

 set_bottom = function(control_bar_height){                                                           
 if(is_user_active){                                                                                     
    document.getElementById("video-link").style.bottom = control_bar_height + 30 + 'px';       
     }else{                                                                                                  
         document.getElementById("video-link").style.bottom = 30 + 'px';                           
     }                                                                                                       
 };





 this.on("useractive", function () {                                                                         
     is_user_active = true;                                                                                  
     set_bottom(this.controlBar.height());                                                            
 });                                                                                                         

it will set both bottom increase and decrease delays to 0.3s.
How may I do this?

Soli
  • 842
  • 2
  • 11
  • 24
  • Can you post a [Minimal, Complete Verifiable Example](https://stackoverflow.com/help/mcve) – bhansa Nov 15 '17 at 07:42
  • If you want the different transitions to happen on different events (like hovering end unhovering), just assign them to different pseudo classes (`:hover` and default). – Mr Lister Nov 15 '17 at 07:58
  • https://stackoverflow.com/questions/34601057/how-to-have-different-transition-durations-for-css-and-angular-transition-on-sam – Bas van Dijk Nov 15 '17 at 08:44
  • It is NOT a duplicate question! – Soli Nov 15 '17 at 08:55
  • Without seeing a working example I'm hazy as to what the issue actually is, so I'm not sure if this is related to the issue, but I notice that in your JS you are setting transition-delay like so: 'bottom .3s'. I may be wrong but doesn't transition-delay only accept a time as a value? ("bottom" is not a time) – Jonathan Nicol Nov 15 '17 at 09:34
  • @JonathanNicol That was before I set it in css. I deleted that. Sorry for the confusion – Soli Nov 15 '17 at 11:45

0 Answers0