How to add a image to the default selected JQuery tab by adding a class?
I have a jQuery tab, where I need to add an image.
So When a tab is selected it looks like
This is being achieved by the following code:
$(".ui-state-active").css("background-image", "url('/Content/images/tab-over.png')");
$('#tabs .tab-menu li a').click(function() {
$('#tabs .tab-menu li').css("background-image", "none");
$(this).parent().css("background-image", "url('/Content/images/tab-over.png')");
});
It works fine expect that in the first line of code I want to remove that class (.ui-state-active) and add my own class. How can that be done ? Here is my tab code:
<ul class="tab-menu">
<li><a href="<%= Url.Action("GetCoreTab", "Tab") %>" class="a"><b>
<div id="home" class="menu">
</div>
</b></a></li>
<li><a href="<%= Url.Action("GetCustomerInformationTab", "Tab") %>" class="a"><b>
<div id="customer-information" class="menu">
</div>
</b></a></li>
<li><a href="<%= Url.Action("GetRatesAndChargesTab", "Tab") %>" class="a"><b>
<div id="rates-and-charges" class="menu">
</div>
</b></a></li>
<li><a href="<%= Url.Action("GetPaymentsAndVouchersTab", "Tab") %>" class="a"><b>
<div id="payments-and-vouchers" class="menu">
</div>
</b></a></li>
<li><a href="<%= Url.Action("GetDeliveryAndCollectionTab", "Tab") %>" class="a"><b>
<div id="delivery-and-collection" class="menu">
</div>
</b></a></li>
<li><a href="<%= Url.Action("GetGeneralTab", "Tab") %>" class="a"><b>
<div id="general" class="menu">
</div>
</b></a></li>
<li><a href="<%= Url.Action("GetEquipmentAndOtherDriversTab", "Tab") %>" class="a">
<b>
<div id="equipment-and-other-drivers" class="menu">
</div>
</b></a></li>
<li><a href="<%= Url.开发者_运维知识库Action("GetCustomerPreferencesTab", "Tab") %>" class="a"><b>
<div id="customer-preferences" class="menu">
</div>
</b></a></li>
<li><a href="<%= Url.Action("GetCustomerStatisticsTab", "Tab") %>" class="a"><b>
<div id="customer-statistics" class="menu">
</div>
</b></a></li>
</ul>
Any help is appreciated.
Thanks.
I recommended you to overwrite .ui-state-active class and remove all the styles associated to it. This class is added to an element with its is activated, so removing the styles overwritting it should be ok.
精彩评论