ユーザーがラベルの上にカーソルを置いたときに、フォームの入力ラベルをフェードまたは非表示にできると便利です。私の特定のケースでは、ラベルを入力ボックスの上に「絶対に」配置したので、ユーザーがラベルの上にマウスを移動するか、入力ボックスをクリックすると、ラベルが消えてしまいます(そのため、タイプはありません)ラベル テキストの下に表示されます)。
CSS を使用して、テキスト入力のクリック時にラベルを非表示にすることができましたが、ホバー (またはマウスオーバー) または同様のときにラベルを「display:none」にする方法が見つかりませんでした。
jQueryについて私が考えていたのは次のとおりですが、ホバーを機能させることができませんでした:
<script>
$('#userNameLabel').on('hover', function() {
$(this).css('display','none');
});
</script>
HTML:
<input type="text" id="userName" name="userName" onclick="$('#userNameLabel').css('display','none');"></input>
<label id="userNameLabel" for="userName">Username</label>
編集: マークアップが有効になるように調整されましたが、問題は残っています。