0

I know this question was asked before but suggested solutions are not working in my case. I am using bootstrap and I am trying to change image url when link is active. Example:

HTML:

<a id="aClientInfo" href="#" class="list-group-item active text-center">
    <img class="img-responsive imgClientInfo" src="../Images/Reports/Claims-Info-
     Blue-New.png" />
    <br />
    Client Info 
</a>

CSS:

#aClientInfo.active > .imgClientInfo
{
 content:url("../Images/Reports/Claims-Info-Purple-New.png");   
}

This solution is working perfectly on chrome browsers. But whenever I run it on IE or FireFox, the image won't change ... I have tried to implement before and after but then it won't work neither on chrome... I really can't understand how before and after can work here with active class... Any suggestions? I need a solution that could work also on safari as it is a responsive website. Thanks

Mlle 116
  • 1,149
  • 4
  • 20
  • 53
  • can you provide with css for the rest of the html elements involved? – Dejan.S Jul 03 '17 at 06:01
  • @Dejan.S Sorry but I did not understand what you mean – Mlle 116 Jul 03 '17 at 06:06
  • how does your css for `aClientInfo` `list-group-item` `active` `img-responsive` `imgClientInfo` look – Dejan.S Jul 03 '17 at 06:16
  • `list-group-item` `active` `img-responsive` are native bootstrap classes, aclientInfo is just an ID that I am using it in css file when icon link is clicked (#aClientInfo.active) to change the content of the image which class is `.imgClientInfo`. `aClientInfo` and `imgClientInfo` are not defined with anything else then mentioned above – Mlle 116 Jul 03 '17 at 06:20
  • Possible duplicate of [Is it possible to set the equivalent of a src attribute of an img tag in CSS?](https://stackoverflow.com/questions/2182716/is-it-possible-to-set-the-equivalent-of-a-src-attribute-of-an-img-tag-in-css) – Lars Beck Jul 03 '17 at 06:53

0 Answers0