Solucio animate
De wikiserver
<link rel="stylesheet" href="animate.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(':button').click(function() {
$('#missatge').addClass('animated bounceOutLeft');
});
});
</script>
</head>
<body>
<div id="missatge">mensaje</div>
Nova solució:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
$(':button').click(function () {
$('#missatge').addClass('animate__animated animate__bounceOutLeft');
});
});
</script>
</head>
<body>
<button>Animar</button>
<div id="missatge">Missatge</div>
</body>
</html>