schweben Opazität und klicken Sie auf Opazität

Question

Ich habe einige Bild-Links, die Deckkraft bei Rollover mit Jquery ändern. Ich möchte auch die Deckkraft der "inaktiven" Bilder ändern, wenn sie angeklickt werden und die aktive Klasse des vorherigen Bildes entfernen. Vielleicht haben einige Code zu demonstrieren:

html:

<div style="width:940px; text-align:center; padding-bottom:10px;"> 
    <a href="#" class="nobase" onClick='jQuery("#youtube-player-container").tubeplayer("play", "adI8ZRzjnlE");'> 
     <img class="active" src="images/video_thumbs/003.jpg" width="300" height="167" alt="La Vie en Couleur"> 
    </a> 
    <a href="#" class="nobase" onClick='jQuery("#youtube-player-container").tubeplayer("play", "5L1vrwEvP-c");'> 
     <img class="inactive" src="images/video_thumbs/001.jpg" width="300" height="167" alt="A Holiday Video"> 
    </a> 
    <a href="#" class="nobase" onClick='jQuery("#youtube-player-container").tubeplayer("play", "ijfgzId6jdI");'> 
     <img class="inactive" src="images/video_thumbs/002.jpg" width="300" height="167" alt="La Vie en Couleur"> 
    </a> 
</div> 

JQuery

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("img.inactive").hover(function() { 
      $(this).stop().animate({ 
       "opacity": "1" 
      }, "slow"); 
     }, function() { 
      $(this).stop().animate({ 
       "opacity": "0.6" 
      }, "slow"); 
     }); 
    }); 
</script> 

css:

.inactive {opacity:0.6;} 
.active {opacity:1.0;} 

so dass im Grunde ist es das, was ich auf Roll wollen, aber ich will um die aktive Klasse auch bei Klick zu wechseln.

Answer 1

ich glaube, Sie das meiste davon in plain ol CSS tun können

selector:hover{} 

selector:active{} 

oder Sie können diese für

$('elm').bind({'click':action,'hover':action}); 

function action(e){ 
$(e.currentTarget).doSomething(); 
} 

Answer 2

tun, was ich verstanden, Sie wollen die Klasse ändern. können Sie in beiden Hover-Funktionen verwenden:

element.toggleClass('className') 

oder können Sie explizit entfernen oder schließen die Klasse, die Sie wollen:

element.removeClass('className') 
element.addClass('className') 

Ich hoffe, dass das, was Sie wollen. =]