Diferència entre revisions de la pàgina «Solucio animate»
De wikiserver
| Línia 18: | Línia 18: | ||
</source> | </source> | ||
| − | < | + | Nova solució: |
| + | |||
| + | <source lang="jquery"> | ||
<!DOCTYPE html> | <!DOCTYPE html> | ||
<html lang="en"> | <html lang="en"> | ||
| Línia 48: | Línia 50: | ||
</html> | </html> | ||
| + | </source> | ||
Revisió de 19:44, 6 març 2024
<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>
