jQuery相对运用

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/jquery-3.7.1.js" ></script>
<style>
  div{
    height: 65px;
    width: 165px;
    background-color: greenyellow;
    position: absolute;

}
</style>
<script>
  $(function(){
    $('button').click(function(){
    $('div').animate({
      left:'250px',
      width:'+=10px',
      height:'+=10px'
      },500)

    $('div').animate({
      opacity: 0.3
      },500)

  $('div').animate({
      fontSize: '50px'
      },500)

    })
  })
</script>
</head>
<body>
  <button>动画按钮</button>
  <div>jQuery</div>

</body>
</html>

posted on 2024-11-29 07:26  蓯芯開矢  阅读(1)  评论(0编辑  收藏  举报