概要:ユーザーエクスペリエンスを大切にしている多くのデザイナーは、マウスがホバーするときにフォーカスまたはスタイルの切り替え効果を取得するというフォーカスを追加したいと考えています。実際、非常に簡単です。ページ上のテキストボックスに加えて、オンフォーカスイベントまたはその他の対応するイベントを取得する必要があります。この記事では、焦点を取得するときにスタイルを切り替える方法を紹介します。
ユーザーエクスペリエンスを大切にする多くのデザイナーは、フォーカスまたはマウスホバーを取得したときにフォーカスまたはスタイルスイッチング効果のフォーカスを追加することを望んでいます。実際、非常に簡単です。ページ上のテキストボックスに加えて、オンフォーカスイベントまたはその他の対応するイベントを取得する必要があります。この記事では、焦点を取得するときにスタイルを切り替える方法を紹介します。
次のようにコードコードをコピーします。
function focosinput(focusclass、normalclass){
varings = document.getElementsByTagname( "input");
for(var i = 0; i <elements.length; i ++){
if(elements [i] .type!= "button" &&要素[i] .type!= "submit" &&要素[i] .type!= "reset"){reset "){
// if_f(elements [i] .type == "text"){{
要素[i] .onfocus = function(){this.classname = focusclass;};
要素[i] .onblur = function(){this.classname = normalclass ||};
}
}
}
window.onload = function(){
focusinput( 'focusinput'、 'normalInput');
}
次のようにコードコードをコピーします。
<style type = "text/css">
.normalinput {border:1px solid #ccc;}
.focusinput {border:1px solid#ffd42c;}
</style>