Comment faire clignoter un texte sans utiliser blink\ javascript
zahaëra2.0
-
Gardeboue Messages postés 49 Date d'inscription Statut Membre Dernière intervention -
Gardeboue Messages postés 49 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
je suis élève et je voudrait savoir comment on fait pour qu,un texte clignote sans utiliser la balise blink ni le javascript
je suis élève et je voudrait savoir comment on fait pour qu,un texte clignote sans utiliser la balise blink ni le javascript
A voir également:
- Blink html
- Editeur html - Télécharger - HTML
- Word html - Télécharger - Bureautique
- Html tidy - Télécharger - Web Design
- Html executable - Télécharger - Divers Web & Internet
- Espace en html ✓ - Forum HTML
2 réponses
Bonjour,
Sur du papier ? Hmm, très difficile !
Tu es élève et tu dois rendre le devoir quand ?
Sur du papier ? Hmm, très difficile !
Tu es élève et tu dois rendre le devoir quand ?
CCM ne fait pas les exercices !.. De l'aide peut être demandée si on montre l'avancée du travail qu'on a soi-même réalisé. Il faut, bien sûr, que le sujet relève de l'informatique.
Bonjour,
Il est possible de faire clignoter un texte avec l'animation en css3
https://www.w3schools.com/css/css3_animations.asp
Exemple :
Il est possible de faire clignoter un texte avec l'animation en css3
https://www.w3schools.com/css/css3_animations.asp
Exemple :
<!DOCTYPE html>
<html>
<head>
<style>
p {
-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
-webkit-animation-duration: 1s; /* Safari 4.0 - 8.0 */
-webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
animation-name: example;
animation-duration: 1s;
animation-iteration-count: infinite;
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
100% {color:red;}
}
/* Standard syntax */
@keyframes example {
100% {color:red;}
}
</style>
</head>
<body>
<p><b>Mon texte clignotant.</p>
<div></div>
</body>
</html>
La question étant en JavaScript il faudra utiliser setInterval voire requestAnimationFrame.
Le principe est on ne peut plus simple:
un coup on affiche le texte un cou on affiche rien du tout.
Le principe est on ne peut plus simple:
un coup on affiche le texte un cou on affiche rien du tout.
<p id=blink> </p>
window.setInterval(
let cpt=0;// 'let' est equivalent de 'var' en mieux en ES6(dernière version de JS)
let clignote= document.getElementById('blink');
if(Math.floor(cpt/2) === cpt/2){
clignote.innerHTML='je clignote a chaque seconde';
}else{
clignote.innerHTML='';
}
cpt++;
);
Oups j'en ai oublié un bout !
LE SCRIPT AU DESSUS EST ÉVIDEMMENT FAUX(pas pu modifier)
let cpt=0;// 'let' est equivalent de 'var' en mieux en ES6(dernière version de JS)
let clignote= document.getElementById('blink');
window.setInterval(
function(){
if(Math.floor(cpt/2) === cpt/2){
clignote.innerHTML='je clignote a chaque seconde';
}else{
clignote.innerHTML='';
cpt++;
},1000
);
LE SCRIPT AU DESSUS EST ÉVIDEMMENT FAUX(pas pu modifier)
let cpt=0;// 'let' est equivalent de 'var' en mieux en ES6(dernière version de JS)
let clignote= document.getElementById('blink');
window.setInterval(
function(){
if(Math.floor(cpt/2) === cpt/2){
clignote.innerHTML='je clignote a chaque seconde';
}else{
clignote.innerHTML='';
cpt++;
},1000
);
Clignotement par opacité
Dans le fichier HTML
Et le code JS
Clignotement par tout ou rien
Dans la page HTML
Et le JS associé
Dans le fichier HTML
<label id="LblClignotant">Le texte à faire clignoter</label>
Et le code JS
<script type="text/javascript">
var signe = -1;
var clignotementFading = function(){
var obj = document.getElementById('LblClignotant');
if (obj.style.opacity >= 0.96){
signe = -1;
}
if (obj.style.opacity <= 0.04){
signe = 1;
}
obj.style.opacity = (obj.style.opacity * 1) + (signe * 0.04);
};
// mise en place de l appel de la fonction toutes les 0.085 secondes
// Pour arrêter le clignotement : clearInterval(periode);
periode = setInterval(clignotementFading, 85 );
</script>
Clignotement par tout ou rien
Dans la page HTML
<div id="DivClignotante" style="visibility:visible;"> Exemple de texte clignotant par visibilité </div>
Et le JS associé
<script type="text/javascript">
var clignotement = function(){
if (document.getElementById('DivClignotante').style.visibility=='visible'){
document.getElementById('DivClignotante').style.visibility='hidden';
}
else{
document.getElementById('DivClignotante').style.visibility='visible';
}
};
// mise en place de l appel de la fonction toutes les 0.8 secondes
// Pour arrêter le clignotement : clearInterval(periode);
periode = setInterval(clignotement, 800);
</script>
