Animé un bouton

Résolu
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 - 28 déc. 2004 à 16:11
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 - 29 déc. 2004 à 15:58
bonjour je voudrais connaitre votre avis
je voudrais animer un bouton style on/off
qu'il change de couleur et lors du clik qu'il permette de lancer des fonctions php
quel est le meilleur moyen :javascript ou flash
et pouvez vous me donner un exemple ou un bon tuto???

19 réponses

malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 14:42
Et G fait une autre erreur...decidement, lol...

Bon re-le code:

<script language="javascript">
var couleur=0;
function teste_couleur(id)
{
a=document.getElementById(id).style;
if (!couleur)
{
a.backgroundColor="green";
couleur=1;
}
else
{
a.backgroundColor="red";
couleur=0;
}
}
</script>

Texte
3
coockiesch Messages postés 2268 Date d'inscription mercredi 27 novembre 2002 Statut Membre Dernière intervention 13 septembre 2013 4
28 déc. 2004 à 19:44
Salut!
Si tu veux du JS, rdv sur le site de JS: http://www.javascriptfr.com/ mais le JS peut être désactivé...

Sinon, tu as le CSS (la propriété :hover) qui fonction théoriquement pour tous les éléments sauf que sous MSIE, elle ne fonctionne que pour les liens...

Si tu veux un exemple pour les CSS, dis le moi, j'en ai pas mal, ;-)

@++

R@f

www.allpotes.ch: Photos, humour, vidéos, gags, ...

"On dit que seulement 10 personnes au monde comprenaient Einstein. Personne ne me comprends. Suis-je un génie???"
0
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 1
29 déc. 2004 à 09:27
ecoute je veux bien un exemple si tu en as!!!!!
avec grand plezir,meme!!!!!!!!!!!!!

moi j'ai trouver pas mal de truc qui changer lors du passage de la souris et moi je voudrais un bouton qui change de couleur(vert/rouge) et de nom(on/off) apres un simple click

si t'as un truc qui pourrait m'aider a avancer je suis preneur!!!
0
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 1
29 déc. 2004 à 10:26
j'ai réussi a faire un bouton en CSS qui est vert et devient rouge au passage de la souris mais redevient vert une fois la souris retirée!!!!!!!!!!!!!!!!et ca je ne veux pas!!!!
et je voudrais savoir si le texte peut lui aussi changer ???
je suis un peu perdu la!!!
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 10:45
Ca c'est facile :

<td style="background-color:green" onMouseOver="this.style.backgroundColor='red'" onMouseOut="this.style.backgroundColor=red"">texte</td>

Oui tu peux tout changer, texte, style du texte, taille de la cellule etc...explore les css et innerHTML.
0
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 10:45
enfin:

texte


evidemment, la.
0
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 1
29 déc. 2004 à 11:02
sympa!!!
mais pr le changement de texte justement tu dis que c simple
moi j'en ai vu en CSS mais pr changer la police ou la couleur mais pas le texte en lui meme....
enfin je crois pas!!!
si tu sais je veux bien un exemple ....
merci bcp
0
coockiesch Messages postés 2268 Date d'inscription mercredi 27 novembre 2002 Statut Membre Dernière intervention 13 septembre 2013 4
29 déc. 2004 à 11:34
Salut!
Changer le texte, je crois pas... Si c'est pour des liens, tu peux changer l'image qui contient le texte...

Voici ce que j'utilise:
/* Lien (Off) */
a.menu:link, a.menu:active, a.menu:visited
{
position: relative;
/* Décallage de 1px vers la droite */
left: 1px;

/* Image d'arrière fond */
background-image: url(../../images/design/menu_puce_off.jpg);

font-size: 13px;
color: #0000FF;
/* Identation du texte */
text-indent: 25px;

/* Dimensions du lien (pour l'image)*/
width: 176px;
height: 20px;

display: block;
/* On ne répète pas l'images */
background-repeat: no-repeat;
}

/* Lien (On) */
a.menu:hover
{
position: relative;
left: 1px;

/* Changement de l'image */
background-image: url(../../images/design/menu_puce_on.jpg);

font-size: 13px;
/* Changement de la couleur */
color: #0000A0;
text-indent: 25px;

width: 176px;
height: 20px;

display: block;
background-repeat: no-repeat;
}


@++

R@f

www.allpotes.ch: Photos, humour, vidéos, gags, ...

"On dit que seulement 10 personnes au monde comprenaient Einstein. Personne ne me comprends. Suis-je un génie???"
0
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 1
29 déc. 2004 à 11:35
salut malalam,
je viens de tester ton petit truc et j'avoue que maintenant ca marche te la couleur rouge reste mais j'ai oublier de préciser que je voulais qu'il puisse revenir en vert apres puis en rouge etc....

en fait qu'il change a chaque click!!!!

tu pense que c possible???
0
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 12:07
Si si, changer le texte, avec innerHTML, ca devrait marcher, en js.

Par contre, Latatadu91, je n'ai pas compris ce que tu voulais dans ton dernier message.
A moins que (une illumination soudaine) : ta cellule est rouge.
Le mec passe sa souris, elle devient verte. Il quitte la cellule, elle reste verte. Elle revient, elle passe au rouge. Il quitte, elle reste rouge. Il revient, elle passe au vert...c'est ca? Ou avec des clicks? (mais le principe sera le meme)
0
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 12:16
Dans les 2 cas, il te faut un peu de js, juste pour tester une variable en fait. Le principe :
Ta variable (disons couleur) est a 0.
Ta cellule est rouge au depart.
Le mec clique.
Tu testes ta variable :
Si elle est a 0, tu mets la cellule en vert, et tu passes ta variable a 1.
Si elle est a 1, tu mets la cellule en rouge, et tu passes ta variable a 0.

<script language="javascript">
var couleur=0;
function teste_couleur(id)
{
a=document.getElementById('id').style;
if (!couleur)
{
a.backgroundColor="green";
couleur=1;
}
else
{
a.backgroundColor="red";
couleur=0;
}
}
</script>

Texte
0
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 1
29 déc. 2004 à 14:07
voila en fait c ca !!!
c le mec qui en cliquant sur le bouton fait passer le bouton en ON et OFF indéfiniment avec le changement de couleur qui convient....
c un bouton qui permettra de lancer une fonction ou non suivant le choix du mec et ce indéfiniment !!!!
je sais pas si c plus clair mais je pense que avec vos deux reponses ya qlq chose a faire!!!!

je vais regarder ca de plus pres ...
+++
0
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 14:34
Oups...oui tu remplaces
Texte

par
Texte
0
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 1
29 déc. 2004 à 14:55
je viens de tester cela (malalam)

[bouton.php ON/OFF]

afin de revenir sur la page avec le bouton vert puis ensuite rouge etc...

le truc c que je le vois bien passer au vert mais que qlq millisecondes
puis il repasse en rouge et ce a chque clik

je sais pas si tu l'as tester ou si c mon qui ne va pas....
0
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 15:37
Tui reviens comment sur la page? bouton.php pointe sur quoi? sur cette meme page? en gros c'est un lien qui fait reference a lui-meme?

Ah ben oui forcement...dans ce cas : tu reviens sur la page, et le style de la cellule (TD) est fixe a rouge par defaut...donc forcement, chaque fois, il te le reaffiches en rouge.

Attends...je suis pas specialiste javascript, en php ce serait plus simple lol. Mais je vais voir ce que je trouve...je teste.
0
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 1
29 déc. 2004 à 15:46
nanan mais c bon te prends pas la tete
j'ai pas besoin de faire de lien
par contre si tu peux me conseiller un logiciel FREE pr faire vite fait mes images de boutons ON/OFF je veux bien....
0
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 15:49
Bon, le truc c'est que la variable couleur est perdue en route, forcement (si tu developpes: dans n'importe quel language, une variable a en general une portee limitee si elle est definie entre "accolades"...la, c'est pareil : une page web est comme un objet, toute variable declaree a l'interieur de cet objet est perdue une fois que l'on sort de cet objet).
Le truc c'est de faire passer la variable d'une page sur l'autre (meme si c'est la meme page hein...c'est comme si on creait une instance de cette meme page).
C'est facile, mais heu...je n'arrive pas a la recuperer lol.
Voici le code, avec les interceptions pour essayer de voir ce qui cloche. Ce qui cloche, c'est que je n'arrive pas a recuperer la variable. En php c'est simple, et il me semblait que ct parail en js. Je dois faire une erreur qquepart...

<script language="javascript">

function teste_couleur(id)
{
a=document.getElementById(id).style;
if (couleur==undefined)
{
alert ("Non Defini !");
var couleur="green";
}
if (couleur=="red")
{
alert ("Rouge!");
a.backgroundColor=couleur;
couleur="green";
}
else
{
alert ("Vert!");
a.backgroundColor=couleur;
couleur="red";
}
}
</script>

Texte,
0
malalam Messages postés 10839 Date d'inscription lundi 24 février 2003 Statut Membre Dernière intervention 2 mars 2010 25
29 déc. 2004 à 15:52
Heu non, lol...utilise une demo? Photoshop evidemment, Fireworks...paint shop pro peut-etre...gimp est gratuit je crois, et il est tres bien!
0
LaTatadu91 Messages postés 968 Date d'inscription jeudi 20 mai 2004 Statut Membre Dernière intervention 26 avril 2013 1
29 déc. 2004 à 15:58
merci!!!!
0
Rejoignez-nous