Question 36061 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Removing transition from background-color doesn't work – Jquery

I have a script that adds a class "notransition" to the body on the page load (it removes it after set time). I want to remove background-color and color transition from every element, but it doesn’t seem to work.

$(window).on("load", function(){
    $("body").addClass("notransition");
    setTimeout(function(){
        $("body").removeClass("notransition");
    }, 1000);
});

.notransition *{
  transition-property: background-color, color !important;
  transition-duration: 0s !important;
}

However, I can remove every transition with code like this:

.notransition *{
  transition: none !important;
}

Is it possible to apply it only to color and background-color properties?

Tags:

2

Answers


  1. 0

    Try this code which may help you to fix your problem:

    .notransition *{
    transition:background-color 0s, color 0s;
}
    Login or Signup to reply.
  2. 0

    If I understand your quest properly it should be reverse, e.g. setTransition instead of notransition if you want to flash text on page load:

    $('document').ready(function() {
  $("body").addClass("setTransition");
  setTimeout(function(){
    $("body").removeClass("setTransition");
  }, 1000);
});
    
    .setTransition {
  background-color: yellow;
  color: red;
  transition-property: background-color, color;
  transition-duration: 1s;
}
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="greeting">
Hi there!
</div>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search