クリックした後にCSSボタンをアクティブにしておくには？

Question

私はnav barを作ろうとします。ユーザーが画像をクリックすると、画像はアクティブのままです。次の例では、isをクリックした後に葉が緑色のままになります。ここでは、私が話していることのコードのビットがあります：

<a class="myButtonLink" href="#LinkURL">Leaf</a> 

<style> 
.myButtonLink { 
    display: block; 
    width: 100px; 
    height: 100px; 
    background: url('http://kyleschaeffer.com/wordpress/wp-content/uploads/2009/01/buttonleafhover.png') bottom; 
    text-indent: -99999px; 
} 
.myButtonLink:hover { 
    background-position: 0 0; 
} 
</style> 

Answer 1

http://jsfiddle.net/bnaegele/XHBZf/2/

$('.myButtonLink').click(function() { 
    $(this).css('background-position', '0 0'); 
}); 

Answer 2

クリックするとクラスが適用されます。

$('.myButtonLink').click(function() { 
    $(this).toggleClass('active'); 
}); 

このコードは、第二のクリックで葉の選択を解除する追加の効果があります。あなたの要求に応じて、あなたはそれを望むかもしれません。

例：http://jsfiddle.net/stulentsev/XHBZf/1/