简体   繁体   中英

when i click link how to change selected color in image in css using javascript

When I click link, how to change selected color in image in CSS using JavaScript? How do I use JavaScript in below code?

    .review {
      padding-left: 55px;
      display: inline-block;
    }
    .icon1 {
      display: inline-block;
      background: url('../userimage/icon.jpg') no-repeat -32px -40px;
      width: 12px;
      height: 14px;
      padding-left: 6px;
    }
    .icon2 {
      display: inline-block;
      background: url('../userimage/icon.jpg') no-repeat -32px -66px;
      width: 12px;
      height: 14px;
      padding-left: 6px;
    }
    .icon1:hover {
      background: url('../userimage/icon.jpg') no-repeat -13px -40px;
      width: 12px;
      height: 14px;
      cursor: pointer;
    }
    .icon2:hover {
      background: url('../userimage/icon.jpg') no-repeat -13px -66px;
      width: 12px;
      height: 14px;
      cursor: pointer;
    }
    .icon {
      cursor: pointer;
      color: #848484;
      font-weight: bold;
      margin-left: 5px;
    }

HTML:

<p class="review">
  Was this review helpful?
  <a class="icon" id="jp">
    <span class="icon1"></span>
    Yes
  </a>
  <a class="icon"><span class="icon2"></span>No</a>
</p>

Ok :visited works from the browser history, and I think you want to change the color of the clicked link only. I put some jQuery together

$('a').click(function(){
 if ( $(this).is(":visited"))
     $(this).removeClass("visited");
 else
     $(this).addClass("visited");
 });

and the CSS

    a{
color:#000;
text-decoration:none;
}

a.visited{
color:#205081;
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM