Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Changing background colour for a few seconds only with jQuery

Tags:

jquery

When clicking on a certain element, I want another element's background to become, say, red for x seconds before coming back to its original colour, all of this without using UI jQuery, only jQuery. Is it possible ?

like image 827
drake035 Avatar asked Oct 02 '12 21:10

drake035


People also ask

How can set background color in jQuery?

To add the background color, we use css() method. The css() method in JQuery is used to change style property of the selected element. The css() in JQuery can be used in different ways. The css() method can be used to check the present value of the property for the selected element.

How can change background color of button click in jQuery?

JavaScript Code:$("div"). on( "click", "button", function( event ) { $(event. delegateTarget ). css( "background-color", "green"); });

How would you use jQuery to give an element a red background color?

JavaScript Code:add("textarea"). css( "background", "red" ); });

How can change background color of textbox in jQuery?

If you really need it your way, then do the following: $("#textboxid"). css({"background-color": "color"}); Replace #textboxid with the desired selector, and color with the desired color.


2 Answers

var $el = $("#my-element"),
    x = 5000,
    originalColor = $el.css("background");

$el.css("background", "red");
setTimeout(function(){
  $el.css("background", originalColor);
}, x);
like image 57
ahren Avatar answered Sep 27 '22 15:09

ahren


$("#element1_ID").on('click', function() {  // click on first element
    var bg = $("element2_ID").css('background'); // store original background
    $("element2_ID").css('background', 'red'); //change second element background
    setTimeout(function() {
        $("element2_ID").css('background', bg); // change it back after ...
    }, 1000); // waiting one second
});
like image 37
adeneo Avatar answered Sep 27 '22 16:09

adeneo