peut-on changer, par dom style, la règle css associée à un sélecteur
contenant un :hover ???
je sais le faire par :
document.styleSheets[i].cssRules[j].style.cssText=...
mais je trouve que c'est nettement plus lent que par dom...
peut-on changer, par dom style, la règle css associée à un sélecteur
contenant un :hover ???
je sais le faire par :
document.styleSheets[i].cssRules[j].style.cssText=...
mais je trouve que c'est nettement plus lent que par dom...
peut-on changer, par dom style, la règle css associée à un sélecteur
contenant un :hover ???
je sais le faire par :
document.styleSheets[i].cssRules[j].style.cssText=...
mais je trouve que c'est nettement plus lent que par dom...
Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.
Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.
Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.
SAM wrote:
merci pour ta réponse, cette solution ne marche pas dans mon cas.
changer la classe d'un élément, je sais faire, je me suis sans doute mal
exprimé...
en fait, ce que je souhaite pouvoir faire c'est changer la couleur d'un
élément (par exemple) de manière dynamique.
pour le dom, je ne connais pas de moyen de manipuler les ':hover'
par styleSheet c'est OK MAIS bizarement ça ne marche pas toujours
et je ne pige pas pourquoi, un exemple :
j'ai une classe CSS qui a une méthode telle que :
#setStyleSheetSelectorPropertyValue(cssIndex,selector,property,value);
qui marche très bien quand je l'appelle comme ça :
var css=new CSS();
css.setStyleSheetSelectorPropertyValue(0,'td#content
dl.legend','border','1px solid red');
et c.
par contre, quand j'appelle cette méthode dans un boucle (ce qui est le
but de la manip...) telle que :
for(var selector in obj){
for(var property in obj[selector]){
css.setStyleSheetSelectorPropertyValue(0,selector,property,obj[selector]
[property]);
}}
mon obj ayant la forme :
var obj={selecteur1: {propriete1:valeur1, propriete2: valeur2...},
selecteur2: ...
...}};
donc cet objet est propre càd sans propriété parasites (je l'ai
vérifié).
donc avec cette double boucle, il y a des éléments qui changent de
valeur et d'autres pas, je ne pige pas pourquoi, c'est plus fort que
jouer au bouchon...
bien sûr, j'ai vérifié (alert(machin truc muche)) que le navigateur
prenait bien en compte les changement mais il ne les affiche pas, pour
être clair, quand je lis, après coup le cssText d'un sélecteur j'ai bien
les nouvelles valeurs MAIS pas l'affichage correspondant côté UI du
browser.
ce qui me fait penser qu'il y a une erreur de ma part est que le même
phénomène se produit sur FF et Saf...
malheureusement je n'ai pas une connection permanente, sinon, j'aurais
mis en ligne un "test case" et répondu à tes emails...
SAM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:
merci pour ta réponse, cette solution ne marche pas dans mon cas.
changer la classe d'un élément, je sais faire, je me suis sans doute mal
exprimé...
en fait, ce que je souhaite pouvoir faire c'est changer la couleur d'un
élément (par exemple) de manière dynamique.
pour le dom, je ne connais pas de moyen de manipuler les ':hover'
par styleSheet c'est OK MAIS bizarement ça ne marche pas toujours
et je ne pige pas pourquoi, un exemple :
j'ai une classe CSS qui a une méthode telle que :
#setStyleSheetSelectorPropertyValue(cssIndex,selector,property,value);
qui marche très bien quand je l'appelle comme ça :
var css=new CSS();
css.setStyleSheetSelectorPropertyValue(0,'td#content
dl.legend','border','1px solid red');
et c.
par contre, quand j'appelle cette méthode dans un boucle (ce qui est le
but de la manip...) telle que :
for(var selector in obj){
for(var property in obj[selector]){
css.setStyleSheetSelectorPropertyValue(0,selector,property,obj[selector]
[property]);
}}
mon obj ayant la forme :
var obj={selecteur1: {propriete1:valeur1, propriete2: valeur2...},
selecteur2: ...
...}};
donc cet objet est propre càd sans propriété parasites (je l'ai
vérifié).
donc avec cette double boucle, il y a des éléments qui changent de
valeur et d'autres pas, je ne pige pas pourquoi, c'est plus fort que
jouer au bouchon...
bien sûr, j'ai vérifié (alert(machin truc muche)) que le navigateur
prenait bien en compte les changement mais il ne les affiche pas, pour
être clair, quand je lis, après coup le cssText d'un sélecteur j'ai bien
les nouvelles valeurs MAIS pas l'affichage correspondant côté UI du
browser.
ce qui me fait penser qu'il y a une erreur de ma part est que le même
phénomène se produit sur FF et Saf...
malheureusement je n'ai pas une connection permanente, sinon, j'aurais
mis en ligne un "test case" et répondu à tes emails...
SAM wrote:
merci pour ta réponse, cette solution ne marche pas dans mon cas.
changer la classe d'un élément, je sais faire, je me suis sans doute mal
exprimé...
en fait, ce que je souhaite pouvoir faire c'est changer la couleur d'un
élément (par exemple) de manière dynamique.
pour le dom, je ne connais pas de moyen de manipuler les ':hover'
par styleSheet c'est OK MAIS bizarement ça ne marche pas toujours
et je ne pige pas pourquoi, un exemple :
j'ai une classe CSS qui a une méthode telle que :
#setStyleSheetSelectorPropertyValue(cssIndex,selector,property,value);
qui marche très bien quand je l'appelle comme ça :
var css=new CSS();
css.setStyleSheetSelectorPropertyValue(0,'td#content
dl.legend','border','1px solid red');
et c.
par contre, quand j'appelle cette méthode dans un boucle (ce qui est le
but de la manip...) telle que :
for(var selector in obj){
for(var property in obj[selector]){
css.setStyleSheetSelectorPropertyValue(0,selector,property,obj[selector]
[property]);
}}
mon obj ayant la forme :
var obj={selecteur1: {propriete1:valeur1, propriete2: valeur2...},
selecteur2: ...
...}};
donc cet objet est propre càd sans propriété parasites (je l'ai
vérifié).
donc avec cette double boucle, il y a des éléments qui changent de
valeur et d'autres pas, je ne pige pas pourquoi, c'est plus fort que
jouer au bouchon...
bien sûr, j'ai vérifié (alert(machin truc muche)) que le navigateur
prenait bien en compte les changement mais il ne les affiche pas, pour
être clair, quand je lis, après coup le cssText d'un sélecteur j'ai bien
les nouvelles valeurs MAIS pas l'affichage correspondant côté UI du
browser.
ce qui me fait penser qu'il y a une erreur de ma part est que le même
phénomène se produit sur FF et Saf...
malheureusement je n'ai pas une connection permanente, sinon, j'aurais
mis en ligne un "test case" et répondu à tes emails...
si je lis, après l'avoir changée, une valeur de propriété css, elle
a bien été prise en compte par le navigateur)
MAIS l'UI du navigateur n'affiche pas le changement...
(j'ai mis de alert un peu partout=> pas d'effet)
si je lis, après l'avoir changée, une valeur de propriété css, elle
a bien été prise en compte par le navigateur)
MAIS l'UI du navigateur n'affiche pas le changement...
(j'ai mis de alert un peu partout=> pas d'effet)
si je lis, après l'avoir changée, une valeur de propriété css, elle
a bien été prise en compte par le navigateur)
MAIS l'UI du navigateur n'affiche pas le changement...
(j'ai mis de alert un peu partout=> pas d'effet)
Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.
Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.
Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.
Bon j'ai mis mes tests en ligne :
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>
cette première page donne la différence de comportement entre " Change
Menu Colors NOT OK" et "Change Menu Colors OK"
remarquer qu'avec "NOT OK" certains ":hover" ne changent pas au niveau
UI...
le menu à droite donne les autres pages :
- la page rules ie :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>
a tout qui fonctionne (en css rules)...
Bon j'ai mis mes tests en ligne :
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>
cette première page donne la différence de comportement entre " Change
Menu Colors NOT OK" et "Change Menu Colors OK"
remarquer qu'avec "NOT OK" certains ":hover" ne changent pas au niveau
UI...
le menu à droite donne les autres pages :
- la page rules ie :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>
a tout qui fonctionne (en css rules)...
Bon j'ai mis mes tests en ligne :
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>
cette première page donne la différence de comportement entre " Change
Menu Colors NOT OK" et "Change Menu Colors OK"
remarquer qu'avec "NOT OK" certains ":hover" ne changent pas au niveau
UI...
le menu à droite donne les autres pages :
- la page rules ie :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>
a tout qui fonctionne (en css rules)...
est-ce qu'il ne manque pas :
var css = new CSS();
ici ?
css.setStyleSheetSelectorPropertyValue(0,selector,property,obj[selector]
[property]);
}}
mon obj ayant la forme :
var obj={selecteur1: {propriete1:valeur1, propriete2: valeur2...},
selecteur2: ...
...}};
donc cet objet est propre càd sans propriété parasites (je l'ai
vérifié).
où est le :hover là dedans ?
(ce doit ss doute être inclus dans 'selector')
tu es bien certain que tu as la même chose des 2 côtés ?
et non pas des choses du genre :
- css = a.truc:hover
- obj = a:hover.truc
donc avec cette double boucle, il y a des éléments qui changent de
valeur et d'autres pas, je ne pige pas pourquoi, c'est plus fort que
jouer au bouchon...
Ils réagissent en fonction des nouveaux réglages?
Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()
bien sûr, j'ai vérifié (alert(machin truc muche)) que le navigateur
prenait bien en compte les changement mais il ne les affiche pas, pour
être clair, quand je lis, après coup le cssText d'un sélecteur j'ai bien
les nouvelles valeurs MAIS pas l'affichage correspondant côté UI du
browser.
Pour bien enfoncer le clou je ne vois que ça :
var S = document.getElementsByTagName('style')[0];
var S2 = S.cloneNode(true);
mafonctionQuiTueToutesMesCss(S2);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
function RaZcss(x) {
var S = document.getElementsByTagName('style')[x];
var S2 = S.cloneNode(true);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
}
ce qui me fait penser qu'il y a une erreur de ma part est que le même
phénomène se produit sur FF et Saf...
malheureusement je n'ai pas une connection permanente, sinon, j'aurais
mis en ligne un "test case" et répondu à tes emails...
Je n'en suis qu'aux balbutiements côté modif de feuilles de styles ... :
<http://stephane.moriaux.pagesperso-orange.fr/truc/changer_style_hover>
ce qui semble bien fonctionner est le loop sur les 'rules' ou 'cssRules'
(sauf qu'il faut les tags en majuscules, au moins pour IE)
la fonction remove() ci-dessus annule toutes les modifs faites par
changeCSS(selector, newRules);
Ce qui me laisse à penser que la FdS n'est pas vraiment modifiée.
est-ce qu'il ne manque pas :
var css = new CSS();
ici ?
css.setStyleSheetSelectorPropertyValue(0,selector,property,obj[selector]
[property]);
}}
mon obj ayant la forme :
var obj={selecteur1: {propriete1:valeur1, propriete2: valeur2...},
selecteur2: ...
...}};
donc cet objet est propre càd sans propriété parasites (je l'ai
vérifié).
où est le :hover là dedans ?
(ce doit ss doute être inclus dans 'selector')
tu es bien certain que tu as la même chose des 2 côtés ?
et non pas des choses du genre :
- css = a.truc:hover
- obj = a:hover.truc
donc avec cette double boucle, il y a des éléments qui changent de
valeur et d'autres pas, je ne pige pas pourquoi, c'est plus fort que
jouer au bouchon...
Ils réagissent en fonction des nouveaux réglages?
Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()
bien sûr, j'ai vérifié (alert(machin truc muche)) que le navigateur
prenait bien en compte les changement mais il ne les affiche pas, pour
être clair, quand je lis, après coup le cssText d'un sélecteur j'ai bien
les nouvelles valeurs MAIS pas l'affichage correspondant côté UI du
browser.
Pour bien enfoncer le clou je ne vois que ça :
var S = document.getElementsByTagName('style')[0];
var S2 = S.cloneNode(true);
mafonctionQuiTueToutesMesCss(S2);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
function RaZcss(x) {
var S = document.getElementsByTagName('style')[x];
var S2 = S.cloneNode(true);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
}
ce qui me fait penser qu'il y a une erreur de ma part est que le même
phénomène se produit sur FF et Saf...
malheureusement je n'ai pas une connection permanente, sinon, j'aurais
mis en ligne un "test case" et répondu à tes emails...
Je n'en suis qu'aux balbutiements côté modif de feuilles de styles ... :
<http://stephane.moriaux.pagesperso-orange.fr/truc/changer_style_hover>
ce qui semble bien fonctionner est le loop sur les 'rules' ou 'cssRules'
(sauf qu'il faut les tags en majuscules, au moins pour IE)
la fonction remove() ci-dessus annule toutes les modifs faites par
changeCSS(selector, newRules);
Ce qui me laisse à penser que la FdS n'est pas vraiment modifiée.
est-ce qu'il ne manque pas :
var css = new CSS();
ici ?
css.setStyleSheetSelectorPropertyValue(0,selector,property,obj[selector]
[property]);
}}
mon obj ayant la forme :
var obj={selecteur1: {propriete1:valeur1, propriete2: valeur2...},
selecteur2: ...
...}};
donc cet objet est propre càd sans propriété parasites (je l'ai
vérifié).
où est le :hover là dedans ?
(ce doit ss doute être inclus dans 'selector')
tu es bien certain que tu as la même chose des 2 côtés ?
et non pas des choses du genre :
- css = a.truc:hover
- obj = a:hover.truc
donc avec cette double boucle, il y a des éléments qui changent de
valeur et d'autres pas, je ne pige pas pourquoi, c'est plus fort que
jouer au bouchon...
Ils réagissent en fonction des nouveaux réglages?
Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()
bien sûr, j'ai vérifié (alert(machin truc muche)) que le navigateur
prenait bien en compte les changement mais il ne les affiche pas, pour
être clair, quand je lis, après coup le cssText d'un sélecteur j'ai bien
les nouvelles valeurs MAIS pas l'affichage correspondant côté UI du
browser.
Pour bien enfoncer le clou je ne vois que ça :
var S = document.getElementsByTagName('style')[0];
var S2 = S.cloneNode(true);
mafonctionQuiTueToutesMesCss(S2);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
function RaZcss(x) {
var S = document.getElementsByTagName('style')[x];
var S2 = S.cloneNode(true);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
}
ce qui me fait penser qu'il y a une erreur de ma part est que le même
phénomène se produit sur FF et Saf...
malheureusement je n'ai pas une connection permanente, sinon, j'aurais
mis en ligne un "test case" et répondu à tes emails...
Je n'en suis qu'aux balbutiements côté modif de feuilles de styles ... :
<http://stephane.moriaux.pagesperso-orange.fr/truc/changer_style_hover>
ce qui semble bien fonctionner est le loop sur les 'rules' ou 'cssRules'
(sauf qu'il faut les tags en majuscules, au moins pour IE)
la fonction remove() ci-dessus annule toutes les modifs faites par
changeCSS(selector, newRules);
Ce qui me laisse à penser que la FdS n'est pas vraiment modifiée.
comment peux-tu savoir ça ?
par un alert(monElmt.maPropriete);
tu ne fais que faire réciter par ton navigateur ce que tu viens de lui
dire (amha)
ça ne dit pas qu'il l'a intégré
MAIS l'UI du navigateur n'affiche pas le changement...
Qu'en dit le DOM iInspecteur de Firefox ?
(j'ai mis de alert un peu partout=> pas d'effet)
Un alert ne fait que(*) ce que tu lui demandes :
Est-ce que la demande est de voir dans le tag 'style' ?
ou bien de voir si la modif a été vue (vue != appliquée)
Vue, il y a des chances que oui.
Comprise, ... ça reste à déterminer.
(*) pas tt à fait, c'est en + capable d'exécuter des choses
(souvent à son insu)
Mieux vaut faire écrire qque part
(au moins on évite l'exe involontaire)
comment peux-tu savoir ça ?
par un alert(monElmt.maPropriete);
tu ne fais que faire réciter par ton navigateur ce que tu viens de lui
dire (amha)
ça ne dit pas qu'il l'a intégré
MAIS l'UI du navigateur n'affiche pas le changement...
Qu'en dit le DOM iInspecteur de Firefox ?
(j'ai mis de alert un peu partout=> pas d'effet)
Un alert ne fait que(*) ce que tu lui demandes :
Est-ce que la demande est de voir dans le tag 'style' ?
ou bien de voir si la modif a été vue (vue != appliquée)
Vue, il y a des chances que oui.
Comprise, ... ça reste à déterminer.
(*) pas tt à fait, c'est en + capable d'exécuter des choses
(souvent à son insu)
Mieux vaut faire écrire qque part
(au moins on évite l'exe involontaire)
comment peux-tu savoir ça ?
par un alert(monElmt.maPropriete);
tu ne fais que faire réciter par ton navigateur ce que tu viens de lui
dire (amha)
ça ne dit pas qu'il l'a intégré
MAIS l'UI du navigateur n'affiche pas le changement...
Qu'en dit le DOM iInspecteur de Firefox ?
(j'ai mis de alert un peu partout=> pas d'effet)
Un alert ne fait que(*) ce que tu lui demandes :
Est-ce que la demande est de voir dans le tag 'style' ?
ou bien de voir si la modif a été vue (vue != appliquée)
Vue, il y a des chances que oui.
Comprise, ... ça reste à déterminer.
(*) pas tt à fait, c'est en + capable d'exécuter des choses
(souvent à son insu)
Mieux vaut faire écrire qque part
(au moins on évite l'exe involontaire)
SAM wrote:est-ce qu'il ne manque pas :
var css = new CSS();
ici ?
non c'est (sur http://127.0.0.1/Table_layout/table_layout.xhtml)
tu es bien certain que tu as la même chose des 2 côtés ?
Ils réagissent en fonction des nouveaux réglages?
certains :hover oui, d'autres pas, par exemple :
sur 'div#menu dl dd ul li:hover a' ça change l'UI ;
sur 'div#menu dl dd ul li:hover' et 'div#menu dl dt:hover' ça ne change
PAS l'UI...
Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()
le tremblement ???
veut dire ?
Pour bien enfoncer le clou je ne vois que ça :
var S = document.getElementsByTagName('style')[0];
var S2 = S.cloneNode(true);
mafonctionQuiTueToutesMesCss(S2);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
Ouais, c'est efficace...
mais le temps ???
Je n'en suis qu'aux balbutiements côté modif de feuilles de styles ... :
<http://stephane.moriaux.pagesperso-orange.fr/truc/changer_style_hover>
la fonction remove() ci-dessus annule toutes les modifs faites par
changeCSS(selector, newRules);
Ce qui me laisse à penser que la FdS n'est pas vraiment modifiée.
et pourtant dans mes scripts si je fais un changemet de couleur du genre
:
#f00 -> #0f0
et que je regarde après coup ce que me donne le browser:
rgb(0,255,0)
il a donc bien analysé la nouvelle donnée MAIS n'en a pas tenu compte au
niveau UI...
bizarre
SAM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:
est-ce qu'il ne manque pas :
var css = new CSS();
ici ?
non c'est (sur http://127.0.0.1/Table_layout/table_layout.xhtml)
tu es bien certain que tu as la même chose des 2 côtés ?
Ils réagissent en fonction des nouveaux réglages?
certains :hover oui, d'autres pas, par exemple :
sur 'div#menu dl dd ul li:hover a' ça change l'UI ;
sur 'div#menu dl dd ul li:hover' et 'div#menu dl dt:hover' ça ne change
PAS l'UI...
Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()
le tremblement ???
veut dire ?
Pour bien enfoncer le clou je ne vois que ça :
var S = document.getElementsByTagName('style')[0];
var S2 = S.cloneNode(true);
mafonctionQuiTueToutesMesCss(S2);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
Ouais, c'est efficace...
mais le temps ???
Je n'en suis qu'aux balbutiements côté modif de feuilles de styles ... :
<http://stephane.moriaux.pagesperso-orange.fr/truc/changer_style_hover>
la fonction remove() ci-dessus annule toutes les modifs faites par
changeCSS(selector, newRules);
Ce qui me laisse à penser que la FdS n'est pas vraiment modifiée.
et pourtant dans mes scripts si je fais un changemet de couleur du genre
:
#f00 -> #0f0
et que je regarde après coup ce que me donne le browser:
rgb(0,255,0)
il a donc bien analysé la nouvelle donnée MAIS n'en a pas tenu compte au
niveau UI...
bizarre
SAM wrote:est-ce qu'il ne manque pas :
var css = new CSS();
ici ?
non c'est (sur http://127.0.0.1/Table_layout/table_layout.xhtml)
tu es bien certain que tu as la même chose des 2 côtés ?
Ils réagissent en fonction des nouveaux réglages?
certains :hover oui, d'autres pas, par exemple :
sur 'div#menu dl dd ul li:hover a' ça change l'UI ;
sur 'div#menu dl dd ul li:hover' et 'div#menu dl dt:hover' ça ne change
PAS l'UI...
Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()
le tremblement ???
veut dire ?
Pour bien enfoncer le clou je ne vois que ça :
var S = document.getElementsByTagName('style')[0];
var S2 = S.cloneNode(true);
mafonctionQuiTueToutesMesCss(S2);
document.getElementsByTagName('head')[0].replaceChild(S2,S);
Ouais, c'est efficace...
mais le temps ???
Je n'en suis qu'aux balbutiements côté modif de feuilles de styles ... :
<http://stephane.moriaux.pagesperso-orange.fr/truc/changer_style_hover>
la fonction remove() ci-dessus annule toutes les modifs faites par
changeCSS(selector, newRules);
Ce qui me laisse à penser que la FdS n'est pas vraiment modifiée.
et pourtant dans mes scripts si je fais un changemet de couleur du genre
:
#f00 -> #0f0
et que je regarde après coup ce que me donne le browser:
rgb(0,255,0)
il a donc bien analysé la nouvelle donnée MAIS n'en a pas tenu compte au
niveau UI...
bizarre
Mieux vaut faire écrire qque part
Mieux vaut faire écrire qque part
Mieux vaut faire écrire qque part