jQuery相對運用

蓯芯開矢發表於2024-11-29
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>

相關文章