CODEWITHSUNDEEP
jquery
ABC
ABC

Reputation: 4373

Apply css on anchor tag

I want to highlight(for few seconds) an anchor tag which is placed in li tag on success of an Ajax request. How can I achieve this via Jquery.

this is anchor tag, which is used in my code:

<li class="active">
  <a id="firstTab" data-toggle="tab" href="#adviceContent">
    <i class="icon-large icon-info-sign " ></i>
  </a>
</li>

Upvotes: 0

Views: 893

Answers (2)

Amit Soni
Amit Soni

Reputation: 1427

Call jQuery-UI from Google or jQuery CDN.

And try this on your Ajax success:

var color = $("#firstTab").css("background-color");
var highlightColor = '#bebebe';

$("#firstTab").animate({backgroundColor:highlightColor},500,function(){
   $(this).delay(1000).animate({backgroundColor:color},500);
});

You can check this Fiddle code

Upvotes: 2

AlliterativeAlice
AlliterativeAlice

Reputation: 12577

In your ajax success funciton:

jQuery('#firstTab').css('background-color','#ccc');
setTimeout(function () {
    jQuery('#firstTab').css('background-color','transparent');
},2000);

If you want the color change to be animated, check out jQuery UI Color Animation

Upvotes: 1

Related Questions