jQueryを試しとして、CSSを変える構文
このページは2016/12にjQuery学習のため、初めて作成したもので、とても簡単なjQuery。
この背景色の変更は、jQueryを使わなくてもCSSで簡単にできるのですが。
このボックスにマウスを重ねると背景色が変わる
ボックスのHTML
1 2 |
<div id="jq_lesson_1" style="border:solid 1px #999; width:300px; margin:0 auto; padding:5px 5px; text-align:center;">このボックスにマウスを重ねると背景色が変わる </div> |
jQueryスクリプト
1 2 3 4 5 6 7 |
$(function($) { $("#jq_lesson_1").mouseover(function(){ $(this).css("background-color","#0ff"); }).mouseout(function(){ $(this).css("background-color",""); }); }); |