jQuery基础教程第四版第四章练习

 //(1)(2)题
  $(function () {
    var $html = $('html');
    $html.hide().fadeIn(2000)
    $('p').hover(
      //hover的移入和移出函数
      function () { $(this).css('background', 'red') },
      function () { $(this).css('background', 'none') }
    )
  })

  //(3)
  $(function () {
    $('h2')
      .click(function () {
        var $text = $(this).next();
        $(this).animate({ opacity: 0.25, marginLeft: 20 }, 'slow', function () {
          //当$(this).animate的效果执行完成之后执行参数里的回调函数，也就是执行$text.animate({ opacity: 0.25 }, 'slow')
          $text.animate({ opacity: 0.25 }, 'slow')
        })
      })
  })

  //(4)
  $(function () {
    $(document).keydown(function (event) {
      var $div = $('#switcher');
      //按下任何键位给一个给定位，这里没有做判断是不是上下左右
      $div.css('position', 'relative');
      //是上下左右的其中一个，return结束这个方法，并执行rentun后面的语句
      if (event.which == 37) return $div.css({ left: '-=20' });
      if (event.which == 39) return $div.css({ left: '+=20' })
      if (event.which == 38) return $div.css({ top: '-=20' });
      if (event.which == 40) return $div.css({ top: '+=20' });
      //程序能执行到这里说明按下的不是上下左右，弹出警告框
      alert('输入错误');
    })
  })