タブ上のボタンにフォーカスを設定

こんにちは、タブにフォーカスがあるときにボタンにフォーカスを設定しようとしています。私が抱えている問題は、ボタンの背景イメージを追加すると、イメージの周りにフォーカスカラーが表示されないが、イメージを削除するとボタンが大きく機能するということです。どのようにフォーカスを持っているときにボタンの周りに境界線を配置し、ぼかしでそれをリセットすることができますか？タブ上のボタンにフォーカスを設定

<html> 
<head> 

<script type="text/javascript" src="jquery-1.3.2.min.js"></script> 


<script type="text/javascript"> 

$(document).ready(function() { 
    $('button:button').focus(function(){ 
    $(this).css({'background-color' : 'red'}); 
    }); 
    $('button:button').blur(function(){ 
    $(this).css({'background-color' : 'lightgreen'}); 
    }); 
}); 
</script> 


</head> 
<body> 
    <button type='button' id='btnSubmit' style="background-image:  
    urlbuttonBackground.gif);"  >button</button> 
</body> 
</html>

出典

2012-01-26 Juan Almonte

jQueryの1.3（あなたの必要性につきとしてのスタイルを定義する）button

<button type='button' id='btnSubmit'>button</button>

のCssからインラインスタイルを削除しますか？それはかなり古代です。 – ThiefMaster

あなたはCSSクラスで定義されたこれらのスタイルを持っているし、その後focus上のクラスを適用し、blurにそれを削除することができます。これを試して。

は

button{ 
    background: lightgreen; 
} 
.focusBg{ 
    background: ulr('urlbuttonBackground.gif'); 
    border: 1px solid red; 
}

$(document).ready(function() { 
    //Since the button has an id, you can use id selector 
    $('#btnSubmit').focus(function(){ 
      $(this).addClass('focusBg'); 
    }).blur(function(){ 
      $(this).removeClass('focusBg'); 
    }); 
});

出典

2012-01-26 01:07:05 ShankarSangoli

ありがとうございます –

タブ上のボタンにフォーカスを設定

答えて

関連する問題