sao đoạn jquery của em lại ko chạy thế ạ, Mong các bác giải thích. Em camon nhìu???
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script
src="https://code.jquery.com/jquery-3.4.1.js"
integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
crossorigin="anonymous"></script>
<link rel="stylesheet" href="hamtimeline.css">
<script src=""></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.1.3/TweenMax.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="hamtimeline.js"></script>
</head>
<body>
<div class="load">
<div class="wait"></div>
</div>
<div class="text-center">
<button class="nut1 btn btn-primary"> nut 1</button>
<button class="nut2 btn btn-danger"> nut 2</button>
<button class="nut3 btn btn-warning"> nut 3</button>
<button class="nut4 btn btn-info"> nut 4</button>
<button class="nut5 btn btn-success"> nut 5</button>
</div>
</body>
</html>
CSS:
.load {
width: 100%;
height: 100%;
background-color: aqua;
position: fixed;
top: 0%;
left: 0%;
z-index: 1;
}
.wait{
width: 100px;
height: 100px;
position: fixed;
top: 50%;
left: 50%;
z-index: 2;
margin-left: -50px;
margin-top: -50px;
border-radius: 50%;
background-color: brown;
}
Jquery
$(document).ready(function () {
hieuungload = new TimelineMax({onComplete:noidungvaodi});
hieuungload
.from($('.wait'), 0,7, {opacity:0})
.from($('.load'), 1, {scale:2, opacity:0})
//lap lai
.to($('.wait'), 1 , {scale: 1, ease:Elastic.easeOut.config(1, 0.1)})
.to($('.wait'), 1, {scale:0.3, ease:bounce.easeOut.config(1, 0.5)})
//ket thuc
.to($('.wait'), 0.5, {scale: 7,opacity:0, ease: Power4.easeOut})
.to($('.load'), 0.5, {x:-2200, ease: Power1.easeOut});
hieuungnoidung= new TimelineMax();
hieuungnoidung
.from($('.nut2'),2, {y:500, }, {y:1000, opacity:0})
.staggerFrom($('.btn'), 0.5, {x:500, opacity:0},0.2)
function noidungvaodi(params)
{
hieuungnoidung.play();
}
});