How do I change images on a jQuery tab when the tab is active? -


I'm using the jQuery tab, and I am using images for each tab instead of text. I would like to change the images when the tab is active The code itself is for the tabs:

  & lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "# tab-1" & gt; & Lt; Img src = "images / dashboard_off.gif" /> & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "# Tab2" & gt; & Lt; Img src = "images / advertising_off.gif" /> & Lt; / A & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "# tab3" & gt; & Lt; Img src = "images / marketing_off.gif" /> & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "# Tab-4" & gt; & Lt; Img src = "images / office_off.gif" /> & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "# tab-5" & gt; & Lt; Img src = "picture / networking_off .gif" /> & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "# Tabs-6" & gt; & Lt; Img src = "picture / education_off.gif" /> & gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt;   

I would like to switch to the "On" version of those images ("images / dashboard_on.gif" etc.).

My script is:

  & lt; Script type = "text / javascript" & gt; $ (Function () {$ ("#tabs"). Tabs ({Event: "Mouseover"}}};    

Any help Much appreciated!

Instead of using an image inline, you can use the background image You can consider it; You can switch it to .i-state-active .


If you want to use inline image, you can You can try:

  $ (function () {$ ("#tabs") .tabs ({event: "mouseover"}) .find ('> gt; ul & gt; ; Li '). Hover (function () {$ (This) .find ('img') .prop ('src', function (i, v) {return v.replace ('off.gif', 'on.gif');})}} Prop () {$ (This) .find ('img') .prop ('src', function (i, v) {return v.replace ('on.gif', 'off.gif');}) ;});});    

Comments

Popular posts from this blog

Python SQLAlchemy:AttributeError: Neither 'Column' object nor 'Comparator' object has an attribute 'schema' -

java - How not to audit a join table and related entities using Hibernate Envers? -

mongodb - CakePHP paginator ignoring order, but only for certain values -