У меня есть код для image burst, когда я click button ...
Я назначил для него картинку из picsum
, теперь она не прерываетсяimage ...
В чем проблема, как ее исправить?
<html>
<head>
<link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="css/easyTree/easyTree.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="js/easyTree/easyTree.js"></script>
<style>
body {
background: #eee;
}
</style>
</head>
<body>
<img id="img-explosion-demo" src="https://picsum.photos/200/300?image=0" height="300" width="300"/>
<button style="position:fixed;right:0;top:0;width:100px;height:50px;" onclick="explodeImage()">Explode image</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="js/imgexplode/jquery.imgexplode.min.js"></script>
<script>
var $target = $("#img-explosion-demo");
function explodeImage() {
$target.explodeRestore();
setTimeout(function () {
$target.explode({
maxWidth: 15,
minWidth: 5,
radius: 231,
release: false,
recycle: false,
explodeTime: 320,
canvas: true,
round: false,
maxAngle: 360,
gravity: 10,
groundDistance: 150,
});
}, 300)
}
explodeImage();
</script>
</body>
</html>