[JS] 2 liens sur un même élément (bouton)
Résolu
Digit@lChord
Messages postés
129
Date d'inscription
Statut
Membre
Dernière intervention
-
Digit@lChord Messages postés 129 Date d'inscription Statut Membre Dernière intervention -
Digit@lChord Messages postés 129 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
J'aimerais faire une sorte de bouton en javascript, de sorte que le lien du bouton change une fois qu'on a cliqué dessus et redevienne comme le lien de départ quand on clique pour la 2eme fois.
Pour faire plus simple, au départ je souhaiterais qu'il affiche ça :
et une fois qu'on a cliqué dessus et que sa a mis la musique sur pause, j'aimerais qu'à se même endroit, cette image devienne :
Un bouton quoi ^^'
Merci d'avance :)
J'aimerais faire une sorte de bouton en javascript, de sorte que le lien du bouton change une fois qu'on a cliqué dessus et redevienne comme le lien de départ quand on clique pour la 2eme fois.
Pour faire plus simple, au départ je souhaiterais qu'il affiche ça :
<img src="pause.png" onclick="pause()">
et une fois qu'on a cliqué dessus et que sa a mis la musique sur pause, j'aimerais qu'à se même endroit, cette image devienne :
<img src="play.png" onclick="play()">
Un bouton quoi ^^'
Merci d'avance :)
A voir également:
- [JS] 2 liens sur un même élément (bouton)
- Supercopier 2 - Télécharger - Gestion de fichiers
- Créer un lien pour partager des photos - Guide
- Comment faire une capture d'écran sur un samsung sans bouton ? - Guide
- Avoir 2 comptes whatsapp sur le même téléphone - Guide
- Vérificateur de liens - Guide
4 réponses
Es-ce que tu veux juste le faire avec du JS, ou tu peux le faire avec une bibliothèque javascript, telle que jQuery ??? Si oui, moi j'ai une solution a ton problème
<script src="js/jquery.js" type="text/javascript"></script>
<a href="#" class="button">Salut</a>
<script type="text/javascript">
$(document).ready(function(){
var passage = 1;
$('.button').click(function()({
if(passage==1){
$('.button').addClass('actif');
passage = 2;
}
else if(passage==2){
$('.button').removeClass('actif');
passage = 1;
}
});
});
</script>
Puis, tu crées dans le css une class qui s'appelle actif, que tu met le design que tu veux !
En cas de question je suis là =D--
L'habit ne fait pas le moine, donc Dreamweaver ne fait pas de vous un webmaster !
Tu as télécharger la fichier jquey ?? http://code.jquery.com/jquery-1.7.min.js => copie le texte et met le dans un fichier qui s'appelle jquery.js (le tout qui est dans un dossier js)
<a href="#" class="button">Salut</a>
<script type="text/javascript">
$(document).ready(function(){
var passage = 1;
alert('salut');
$(".button").click(function(){
if(passage==1){
$(".button").addClass("actif");
passage = 2;
return false;
}
else if(passage==2){
$(".button").removeClass("actif");
passage = 1;
return false;
}
});
});
</script>
Réessaye avec sa... Mais juste, il doivent de permettre de faire quoi ce liens ?
J'ai trouvé comment faire finalement :)
Pour les fonctions j'en parlais dans ma 1ere question (play et pause)
Merci quand même :)
Pour les fonctions j'en parlais dans ma 1ere question (play et pause)
<script type="text/javascript">
function playbutton(){
play();
document.getElementById('play').style.display = 'none';
document.getElementById('pause').style.display = 'block';
}
function pausebutton(){
pause();
document.getElementById('pause').style.display = 'none';
document.getElementById('play').style.display = 'block';
}
</script>
<img id="play" src="img/player_hover_play.png" onclick="playbutton()" style="display:none">
<img id="pause" src="img/player_hover_pause.png" onclick="pausebutton()" style="">
Merci quand même :)