2012-07-04 17 views
6

無効モードでボタンのホバー効果を停止する方法。 無効になっているボタンの後にホバー効果を止めることはできません。試してみましたが、正常に機能していません。良い結果を得るために変更したいところです。無効モードでボタンのホバー効果を停止する方法

<div id="prevnexts"> 
      <button id="prevs" class="navButs tprev" disabled="">Prev</button> 
      <button id="nexts" class="navButs tnext" enabled="enabled">Next</button> 
</div> 

CSS

#prevnexts { 
height: 22px; 
left: 50px; 
position: absolute; 
top: 160px; 
width: 75px; 
} 

#prevnexts .tnext, #prevnexts .tprev { 
background: url("images/next1.png") no-repeat scroll 0 0 transparent; 
border: 1px solid transparent; 
height: 25px; 
text-indent: -9999px; 
width: 33px; 
cursor:pointer; 
} 

button[disabled]:active, button[disabled], 
input[type="reset"][disabled]:active, 
input[type="reset"][disabled], 
input[type="button"][disabled]:active, 
input[type="button"][disabled], 
select[disabled] > input[type="button"], 
select[disabled] > input[type="button"]:active, 
input[type="submit"][disabled]:active, 
input[type="submit"][disabled] 
{ 
opacity:0.5; 
} 



#prevnexts .tprev 
{ 
background:url(images/prev1.png) no-repeat 0 0; 
} 

#prevnexts .tprev:hover 

{ 
background:url(images/prev1hover.png) no-repeat 0 0; 
} 

#prevnexts.tnext:hover 
{ 
background:url(images/next1hover.png) no-repeat 0 0; 
    } 

のjavascript:

 $(document).ready(function() { 
    var cnt = 1; 
    var maxLinkss =<?php echo $mypostall; ?>; 
    $("#prevs").attr("disabled","disabled"); 
    $(".tprev:hover").remove(); 
    $("#nexts").attr("enabled","enabled"); 
    $(".navButs").click(function(){ 
    if (this.id=="nexts") { 
    cnt++; 
    console.log(" + ",cnt);  
    } 
    else { 
    cnt--; 
    console.log(" - ",cnt); 

    } 
    if (cnt<0) cnt=0;  
    if (cnt>maxLinkss-1) { 
    $("#nexts").attr("disabled","disabled"); 

    } 
    else { 
    $("#nexts").removeAttr("disabled"); 

    } 
    if (cnt==1) { 
    $("#prevs").attr("disabled","disabled"); 

} 
else { 
    $("#prevs").removeAttr("disabled"); 
} 
}); 
}); 
+0

は有効のattrのthebpointは何ですか? – rlemon

+0

またiircを使用する必要があります。attrはload $( "#prevs")にload – rlemon

+0

を実際に適用する属性を設定します。attr( "disabled"、 "disabled");最初にprevボタンが無効になっているためです。 – user1501278

答えて

1

あなたはCSS :not()セレクタを使用することができます。例:button:not([enabled="enabled"]):not()セレクタhereの詳細

10

用途:enabledが、IE < 9は、それをサポートしていません:すべての非無効の要素が有効になっている場合

<style type="text/css"> 
.my_button{ 
    /* ... */ 
} 

.my_button:hover:enabled{ 
    /* this will only show when the button is enabled, */ 
    /* and the user is hovering over it.. */ 
} 
</style> 
関連する問題