jQueryを試しとして、ＣＳＳを変える構文

2016-12-22このページは2016/12にjQuery学習のため、初めて作成したもので、とても簡単なjQuery。

この背景色の変更は、jQueryを使わなくてもCSSで簡単にできるのですが。

このボックスにマウスを重ねると背景色が変わる

ボックスのHTML

<div id="jq_lesson_1" style="border:solid 1px #999; width:300px; margin:0 auto; padding:5px 5px; text-align:center;">このボックスにマウスを重ねると背景色が変わる
</div>

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スクリプト

$(function($) {
  $("#jq_lesson_1").mouseover(function(){
    $(this).css("background-color","#0ff");
  }).mouseout(function(){
    $(this).css("background-color","");
  });
});

$(function($) {

$("#jq_lesson_1").mouseover(function(){

$(this).css("background-color","#0ff");

}).mouseout(function(){

$(this).css("background-color","");

});