Page 1 sur 2
Style Bouton JScript dans <td> Optimisation façon css
Posté : 29 sept. 2005, 11:04
par Lareine
Voilà ce que je met dans chacune des cellules du tableau:
[/color]
[php]<td align="center" background="bgbtyr.jpg"
bgcolor="#FAEA92" style="border-style: outset"
onmousedown="this.style.borderStyle='inset'"
onmouseup="this.style.borderStyle='outset'"
onchange="background='bgbtyr.jpg'">[/php]
[color=orange][HTML][/color]
j'aimerais maintenant mettre la partie javascript dans une
feuille séparé appelé [b]ippai.js[/b]
j'ai réecrit d'une façon que je supose pas bonne :roll: :
[color=orange][ippai.js][/color]
[php]stbt {
onmousedown="this.style.borderStyle='inset'"
onmouseup="this.style.borderStyle='outset'"
onchange="background='bgbtyr.jpg'"
}[/php]
[color=orange][/ippai.js][/color]
et pour appeler la fonction je voudrait mettre:
[color=orange][PHP/HTML][/color]
[php]<script language=JavaScript src="ippai.js"></script>[/php]
[color=green]et dans chaque cellule:[/color]
[php]<td style="ippai.js='stbt'">[/php]
[color=orange][/PHP/HTML][/color]
Merci si quelqu'un peut me donner son avis et m'aider
à remettre mon code en ordre :oops: !
j'ai cru lire aussi qu'on pouvait inclure un javascript
dans un [b]css[/b] mais je n'arrive plus a trouver où :oops: !
Posté : 29 sept. 2005, 11:11
par mere-teresa
Oula, tu t'es un peu mélangée les pinceaux.
Il te faut définir des fonctions javascript, que tu vas mettre dans ton fichier .js
Ensuite tu inclus ce fichier (là ton code est bon) dans le head, ainsi tu pourras te servir des fonctions dans toute la page.
onmousedown="this.style.borderStyle='inset'"
onmouseup="this.style.borderStyle='outset'"
onchange="background='bgbtyr.jpg'"
sera remplacé par
onmousedown="javascript: changeBordureIn(this)"
onmouseup="javascript: changeBordureOut(this)"
onchange="javascript: changeBckgd(this)"
et ton fichier Javascript sera avec
function changeBordureIn(td_element)
{
td_element.style.borderStyle='inset';
}
Avec un peu de classe, tu ferais même une seule fonction qui modifie si c'est en inset, le mettre en outset et si c'est en outset mettre en inset et sinon...etc...
Posté : 29 sept. 2005, 11:17
par Lareine
Merci pour ton aide

! Même si j'avoue ne pas avoir tout pigée

!
Je met quoi dans la balise
<td > au final pour appeler ma fonction

?
Posté : 29 sept. 2005, 11:23
par mere-teresa
onmousedown="javascript: changeBordureIn(this)"
onmouseup="javascript: changeBordureOut(this)"
onchange="javascript: changeBckgd(this)"
Posté : 29 sept. 2005, 11:33
par Lareine
Mais si je remet ça dans la balise <td> qu'elle est l'interet d'utiliser
une
feuille javascript séparé 
?
N'y aurrais t'il pas moyen d'uttiliser une fonction genre
<td style-javascript="bouton">
histoire d'optimiser le code

?
Posté : 29 sept. 2005, 11:44
par Cyrano
Non : autre chose
lareine n'éparpille pas ton sujet sur trois messages différents pour un problème unique. On est tolérant et tu vois qu'on te répond partout, mais nous prends pas non plus pour des valises

Posté : 29 sept. 2005, 11:49
par mere-teresa
Posté : 29 sept. 2005, 12:02
par Lareine
ça j'ai pigée ou le mettre mais, pas la syntaxe à utiliser dans ma
balise <td>
Il faudrais que je cherche quoi ?
gestion de style javascript dans la cellule d'un tableau
?
Ton exemple parle d'un formulaire, et ce que je veux faire moi
c'est un style de bouton dans un fichier *.js appliquable à plusieurs
cellules...
Le truc parrait simple mais il semble être très dur à trouver des
exemple clair et pratique sur le net

!
Posté : 29 sept. 2005, 12:24
par mere-teresa
Si c'est un style, tu n'as aucun besoin de javascrit.
Juste d'une classe CSS.
Posté : 29 sept. 2005, 13:04
par Lareine
Oui mais non les styles
css ne peuvent pas s'inclure
dans une balise
<td> comme j'ai besoin

!
Donc si d'après toi Style ne convient pas (pour je ne sais quel
raison c'est plutôt une mise en forme de tableau donc peut-
être plutôt quelque chose du genre:
<td
class="changeBordureIn='url(ippai.js)'">
ou
<td
id="changeBordureIn='url(ippai.js)'">
si j'ai pas encore paumée toute ma tête en route

!
[ippai.js]
function changeBordureIn(td_element)
{
td_element.style.borderStyle='inset';
if ( onmousedown="javascript: changeBordureIn(inset)"
onmouseup="javascript: changeBordureOut(outset)"
onchange="javascript: changeBckgd(bgbtyr.jpg)" );
}
[/ippai.js]
J'ai aussi des doutes pour le placement des onmouse?
Posté : 29 sept. 2005, 13:43
par mere-teresa
<td class="avecbords">blabla</td>
et en CSS
.avecbords{
border : 1px outset red;
}
Le javascript sert avec les événements (onMouse..., onChange, etc.)
Posté : 29 sept. 2005, 14:17
par Lareine
donc :
[ippai.js]
Code : Tout sélectionner
function bouton(td_element)
{
td_element.style.borderStyle='inset';
if ( onmousedown="javascript: changeBordureIn(inset)"
onmouseup="javascript: changeBordureOut(outset)"
onchange="javascript: changeBckgd(bgbtyr.jpg)" );
} [ippai.js]
[HTML/PHP]
<script language=JavaScript src="ippai.js"></script>
<td class="bouton">
<a href="index.php">Accueil</a>
</td>
[HTML/PHP]
Comme çà donc

?
Posté : 29 sept. 2005, 14:34
par mere-teresa
Non !
Les capteurs d'événements étaient bien placés, dans le HTML.
<td onMouse="actionjavascript que tu veux lui faire faire"></td>
ton action js peut être dans un fichier externe.
Posté : 29 sept. 2005, 14:45
par Lareine
<td onMouse="function bouton"></td>
donc comme çà

?
Posté : 29 sept. 2005, 14:49
par mere-teresa
Presque :
http://www.phpfrance.com/forums/voir_re ... .php#63691 mais je t'ai déjà donné cette réponse d'une part.
D'autre part, c'est toi qui veux mettre ton javascript en fichier externe 