dom style et :hover ???

SAM

01/04/2008 à 12:42

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...

Comment réalises-tu ça par DOM ?

this.style.background = 'yellow'

ne va pas changer le hover de l'élément, non ?

Ou bien as-tu un truc pour aussi régler le :hover ?

Normalement et comme dit par ailleurs (autre NG) pour changer le style
d'un élément le + simple et rapide est de lui coller une class

<p><a href="#" onclick="this.className = this.className==''?
'autre' : '';
return false">toggle</a></p>

CSS

a { background: #ffc }
a:hover { background: #ff0 }
.autre { background: gold }
.autre:hover { background: orange }

Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.

--
sm

unbewusst.sein

02/04/2008 à 13:19

SAM wrote:

Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.

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
contre 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...
--
Une Bévue

SAM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:

Mais, de la question je comprends que l'alternative (class 'autre')
serait en plus à créer, alors ... retour case départ.

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
contre 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...
--
Une Bévue

Vous avez filtré cet utilisateur ! Consultez son message

SAM

02/04/2008 à 15:27

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é...

J'ai toujours bp de mal à te comprendre, entre tes explications très
courtes et tes fonction manipulatrices à ressorts multiples ... ;-)

en fait, ce que je souhaite pouvoir faire c'est changer la couleur d'un
élément (par exemple) de manière dynamique.

monElement.style.color= 'blue'; :-)

pour le dom, je ne connais pas de moyen de manipuler les ':hover'

Ha ! je me sens moins seul :-)

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]){

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.

--
sm

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é...

J'ai toujours bp de mal à te comprendre, entre tes explications très
courtes et tes fonction manipulatrices à ressorts multiples ... ;-)

en fait, ce que je souhaite pouvoir faire c'est changer la couleur d'un
élément (par exemple) de manière dynamique.

monElement.style.color= 'blue'; :-)

pour le dom, je ne connais pas de moyen de manipuler les ':hover'

Ha ! je me sens moins seul :-)

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]){

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.

--
sm

Vous avez filtré cet utilisateur ! Consultez son message

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é...

J'ai toujours bp de mal à te comprendre, entre tes explications très
courtes et tes fonction manipulatrices à ressorts multiples ... ;-)

en fait, ce que je souhaite pouvoir faire c'est changer la couleur d'un
élément (par exemple) de manière dynamique.

monElement.style.color= 'blue'; :-)

pour le dom, je ne connais pas de moyen de manipuler les ':hover'

Ha ! je me sens moins seul :-)

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]){

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.

--
sm

SAM

02/04/2008 à 16:54

en tout 1er chef :

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)

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)

--
sm

unbewusst.sein

02/04/2008 à 17:03

SAM wrote:

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 :

<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_dom.xhtml>
là, uniquement changement par DOM ie. :
document.getElementById('_id').style[propriete.camelisée]=valeur;
c'est le + rapide

ensuite pour les éléments moins facilement accessibles, j'utilise XPath
à la page :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_xpath.xhtm
l>
pas moyen comme avec DOM de changer les ':hover'...

enfin pour les éléments avec ':hover' j'utilise le seul accès possible,
amha, par styleSheet rules à la page :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>

c'est nettement plus lent (1à à 100 fois...)

aussi la première page :
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>
a un js qui choisi la bonne méthode, question rapidité :

- si id connu => DOM ;
- si pas de :hover => XPath (pour retrouver les éléments) ;
- enfin si :hover alors css rules.

Ce que je ne pige pas (bourde de ma part?) c'est :
- OK et NOT OK sur la première page ;
- la page rules ie :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>
a tout qui fonctionne (en css rules)...
- pourquoi dans certains cas le changement est bien pris en compte (càd
que, 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...

pour moi, ce n'est pas un pb de timing...
(j'ai mis de alert un peu partout=> pas d'effet)

--
Une Bévue

SAM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:

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 :

<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_dom.xhtml>
là, uniquement changement par DOM ie. :
document.getElementById('_id').style[propriete.camelisée]=valeur;
c'est le + rapide

ensuite pour les éléments moins facilement accessibles, j'utilise XPath
à la page :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_xpath.xhtm
l>
pas moyen comme avec DOM de changer les ':hover'...

enfin pour les éléments avec ':hover' j'utilise le seul accès possible,
amha, par styleSheet rules à la page :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>

c'est nettement plus lent (1à à 100 fois...)

aussi la première page :
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>
a un js qui choisi la bonne méthode, question rapidité :

- si id connu => DOM ;
- si pas de :hover => XPath (pour retrouver les éléments) ;
- enfin si :hover alors css rules.

Ce que je ne pige pas (bourde de ma part?) c'est :
- OK et NOT OK sur la première page ;
- la page rules ie :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>
a tout qui fonctionne (en css rules)...
- pourquoi dans certains cas le changement est bien pris en compte (càd
que, 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...

pour moi, ce n'est pas un pb de timing...
(j'ai mis de alert un peu partout=> pas d'effet)

--
Une Bévue

Vous avez filtré cet utilisateur ! Consultez son message

SAM

02/04/2008 à 17:37

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"

NOT OK ou OK = même comportement apparent : menu changé dans Fx

remarquer qu'avec "NOT OK" certains ":hover" ne changent pas au niveau
UI...

Ha! Tien ? oui :-(

le menu à droite donne les autres pages :

Comme je n'ai pas réussi à suivre plus de 2 ou 3 lignes de table_layout.js
(des fonctions à tiroirs multiples en cascades imbriquées)
je jette l'éponge.

- la page rules ie :
<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>
a tout qui fonctionne (en css rules)...

Ni le DOM Inspector
ni Firebug
n'arrivent à me montrer les styles avec pseudos (:hover ou autre)

--
sm

unbewusst.sein

02/04/2008 à 18:42

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)
à la ligne 43 :
[...]
var pageDoneúlse,menuDoneúlse,menuOKDoneúlse;
var css;
window.onload=function(){
if(DOM){
DOM.addMenu("menu",menu);

css=new CSS();// <== LIGNE 43

[...]

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')

oui dans le sélecteur

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

je n'ai pas de :hover.truc et c'est bien la même chose des deu côtés et
même, la même FdS...

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?

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 ?

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);
}

Ouais, c'est efficace...

mais le temps ???

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)

oui, les lire ne pose aucune difficulté..
les cha,ger aussi, mais quant à l'effectivité du changment... c'est
autre chose, me semble-t'il.

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
--
Une Bévue

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)
à la ligne 43 :
[...]
var pageDoneúlse,menuDoneúlse,menuOKDoneúlse;
var css;
window.onload=function(){
if(DOM){
DOM.addMenu("menu",menu);

css=new CSS();// <== LIGNE 43

[...]

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')

oui dans le sélecteur

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

je n'ai pas de :hover.truc et c'est bien la même chose des deu côtés et
même, la même FdS...

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?

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 ?

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);
}

Ouais, c'est efficace...

mais le temps ???

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)

oui, les lire ne pose aucune difficulté..
les cha,ger aussi, mais quant à l'effectivité du changment... c'est
autre chose, me semble-t'il.

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
--
Une Bévue

Vous avez filtré cet utilisateur ! Consultez son message

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)
à la ligne 43 :
[...]
var pageDoneúlse,menuDoneúlse,menuOKDoneúlse;
var css;
window.onload=function(){
if(DOM){
DOM.addMenu("menu",menu);

css=new CSS();// <== LIGNE 43

[...]

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')

oui dans le sélecteur

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

je n'ai pas de :hover.truc et c'est bien la même chose des deu côtés et
même, la même FdS...

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?

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 ?

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);
}

Ouais, c'est efficace...

mais le temps ???

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)

oui, les lire ne pose aucune difficulté..
les cha,ger aussi, mais quant à l'effectivité du changment... c'est
autre chose, me semble-t'il.

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
--
Une Bévue

unbewusst.sein

02/04/2008 à 18:42

SAM wrote:

comment peux-tu savoir ça ?
par un alert(monElmt.maPropriete);

je relis la valeur du cssText pour le rule donné après coup et si j'ai
entré #0f0 le browser me répond rgb(0,255,0) donc il l'a --au moins--
analysé...

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é

oui ça je m'en doute mais j'ai un cas où ça marche (presque) toujours,
la page :

<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>

preque veut dire que la couleur du texte et le font-size ne sont pas
affectés, mais bon, ça je sais le faire par ailleurs en DOM.

MAIS l'UI du navigateur n'affiche pas le changement...

Qu'en dit le DOM iInspecteur de Firefox ?

il y a moyen de voir ça avec le dom inspector ???
existe t'il une version pour ff 3.0b4 ???

j'ai essayé récemment de l'installer mais j'ai eu une erreur...

(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' ?

non, j'écris par :

document.styleSheets[_icss].cssRules[_selectors[_icss].index(selector)].
style.cssText=<mon nouveau rule à moi>

et je relis par :
alert(document.styleSheets[_icss].cssRules[_selectors[_icss].index(selec
tor)].style.cssText)

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.

comprise oui, car si j'envoie #0f0 je reçois rgb(0,255,0)...

mais affichée, NON, enfin pas toujours, c'est ce qui me gène le plus
d'ailleurs que ce soit "pas toujours"...

enfin, ce qui me perturbe aussi est que j'ai les mêmes résultats sur ff
que saf.

donc, me semble t'il l'erreur est de mon côté, mais je ne la vois pas...

faut dire que je suis assez étourdi...

j'ai m@&dé un bon bout de temps sur une boucle for écrite comme ça :

for(var icss=0;icss<_length;icss){...}

(*) 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)

--
Une Bévue

SAM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:

comment peux-tu savoir ça ?
par un alert(monElmt.maPropriete);

je relis la valeur du cssText pour le rule donné après coup et si j'ai
entré #0f0 le browser me répond rgb(0,255,0) donc il l'a --au moins--
analysé...

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é

oui ça je m'en doute mais j'ai un cas où ça marche (presque) toujours,
la page :

<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>

preque veut dire que la couleur du texte et le font-size ne sont pas
affectés, mais bon, ça je sais le faire par ailleurs en DOM.

MAIS l'UI du navigateur n'affiche pas le changement...

Qu'en dit le DOM iInspecteur de Firefox ?

il y a moyen de voir ça avec le dom inspector ???
existe t'il une version pour ff 3.0b4 ???

j'ai essayé récemment de l'installer mais j'ai eu une erreur...

(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' ?

non, j'écris par :

document.styleSheets[_icss].cssRules[_selectors[_icss].index(selector)].
style.cssText=<mon nouveau rule à moi>

et je relis par :
alert(document.styleSheets[_icss].cssRules[_selectors[_icss].index(selec
tor)].style.cssText)

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.

comprise oui, car si j'envoie #0f0 je reçois rgb(0,255,0)...

mais affichée, NON, enfin pas toujours, c'est ce qui me gène le plus
d'ailleurs que ce soit "pas toujours"...

enfin, ce qui me perturbe aussi est que j'ai les mêmes résultats sur ff
que saf.

donc, me semble t'il l'erreur est de mon côté, mais je ne la vois pas...

faut dire que je suis assez étourdi...

j'ai m@&dé un bon bout de temps sur une boucle for écrite comme ça :

for(var icss=0;icss<_length;icss){...}

(*) 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)

--
Une Bévue

Vous avez filtré cet utilisateur ! Consultez son message

SAM wrote:

comment peux-tu savoir ça ?
par un alert(monElmt.maPropriete);

je relis la valeur du cssText pour le rule donné après coup et si j'ai
entré #0f0 le browser me répond rgb(0,255,0) donc il l'a --au moins--
analysé...

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é

oui ça je m'en doute mais j'ai un cas où ça marche (presque) toujours,
la page :

<http://thoraval.yvon.free.fr/Table_layout/tests/table_layout_rules.xhtm
l>

preque veut dire que la couleur du texte et le font-size ne sont pas
affectés, mais bon, ça je sais le faire par ailleurs en DOM.

MAIS l'UI du navigateur n'affiche pas le changement...

Qu'en dit le DOM iInspecteur de Firefox ?

il y a moyen de voir ça avec le dom inspector ???
existe t'il une version pour ff 3.0b4 ???

j'ai essayé récemment de l'installer mais j'ai eu une erreur...

(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' ?

non, j'écris par :

document.styleSheets[_icss].cssRules[_selectors[_icss].index(selector)].
style.cssText=<mon nouveau rule à moi>

et je relis par :
alert(document.styleSheets[_icss].cssRules[_selectors[_icss].index(selec
tor)].style.cssText)

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.

comprise oui, car si j'envoie #0f0 je reçois rgb(0,255,0)...

mais affichée, NON, enfin pas toujours, c'est ce qui me gène le plus
d'ailleurs que ce soit "pas toujours"...

enfin, ce qui me perturbe aussi est que j'ai les mêmes résultats sur ff
que saf.

donc, me semble t'il l'erreur est de mon côté, mais je ne la vois pas...

faut dire que je suis assez étourdi...

j'ai m@&dé un bon bout de temps sur une boucle for écrite comme ça :

for(var icss=0;icss<_length;icss){...}

(*) 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)

--
Une Bévue

SAM

02/04/2008 à 19:04

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)

Bon, si tu le dis :-)

tu es bien certain que tu as la même chose des 2 côtés ?

depuis tu nous a bien donné à manger et ... oui, il apparait que ce soit
bien copié-collé d'un côté (css) à l'autre (obj).

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...

Faut avouer que là encore tu as fait fort dans l'imbrication de balises html
Le Dom Inspector n'est pas perdu mais au déploiement du truc vaut mieux
suivre (le marrant étant les kgs de css qui s'appliquent à chaque
niveau)(je n'en reviens pas que les brouteurs s'en sortent).

ce qui est casse-pieds pour le débugage c'est qu'aucun des outils
d'analyse ne s'intéressent aux pseudo-class
(enfin ceux que j'ai et de la manière dont je les utilise)

Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()

le tremblement ???

le contenu, le patafiolage, le schmillblick ... étoussa :-)

veut dire ?

Nan!
j'ai rien dit !
n'en jetez plus !
ça fait 15 pages écrit serré

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 ???

Le temps de traitement du clone doit être équivalent à celui de l'original,
le remplacement doit être immédiat ?
et puis ... 1/2 seconde pour suivre le tremblement et que le navigateur
opère les changements, je ne trouve pas ça lent.

S'il n'y a qu'une option de modif (ou même plus ?)
au onload yaka préparer le(s) clone(s) comme il faut et au click il n'y
aura plus qu'à faire le remplacement d'un coup d'un seul.

M'enfin le truc était d'enfoncer le clou, marche-ce ?
ou bien traine-t'on encore des incorruptibles ?

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)

? avec quoi regardes-tu ?

il a donc bien analysé la nouvelle donnée MAIS n'en a pas tenu compte au
niveau UI...

Tu veux dire que ColorZilla (ou autre color picker) dis que c'est orange
alors que Fx continue à afficher du jaune ?

bon, maintenant que ça affiche les actions de modifs, on voit que le
change-menu-ok bégaie un peu :

BEFORE: div#menu dl dt:hover {
color: red; background-color: rgb(128, 128, 128);}
AFTER: div#menu dl dt:hover {
color: red; background-color: rgb(106, 202, 106);}
BEFORE: div#menu dl dt:hover {
color: red; background-color: rgb(106, 202, 106);}
AFTER: div#menu dl dt:hover {
color: rgb(255, 102, 0); background-color: rgb(106, 202, 106);}

ça aide peut-être le navigateur à comprendre ?

bizarre

Bon, ici :
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>
maintenant que mon navigateur a bien tout dans son cache,
le change-menu-ok ne prend que 2 ms
Je suis époustouflé !

--
sm

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)

Bon, si tu le dis :-)

tu es bien certain que tu as la même chose des 2 côtés ?

depuis tu nous a bien donné à manger et ... oui, il apparait que ce soit
bien copié-collé d'un côté (css) à l'autre (obj).

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...

Faut avouer que là encore tu as fait fort dans l'imbrication de balises html
Le Dom Inspector n'est pas perdu mais au déploiement du truc vaut mieux
suivre (le marrant étant les kgs de css qui s'appliquent à chaque
niveau)(je n'en reviens pas que les brouteurs s'en sortent).

ce qui est casse-pieds pour le débugage c'est qu'aucun des outils
d'analyse ne s'intéressent aux pseudo-class
(enfin ceux que j'ai et de la manière dont je les utilise)

Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()

le tremblement ???

le contenu, le patafiolage, le schmillblick ... étoussa :-)

veut dire ?

Nan!
j'ai rien dit !
n'en jetez plus !
ça fait 15 pages écrit serré

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 ???

Le temps de traitement du clone doit être équivalent à celui de l'original,
le remplacement doit être immédiat ?
et puis ... 1/2 seconde pour suivre le tremblement et que le navigateur
opère les changements, je ne trouve pas ça lent.

S'il n'y a qu'une option de modif (ou même plus ?)
au onload yaka préparer le(s) clone(s) comme il faut et au click il n'y
aura plus qu'à faire le remplacement d'un coup d'un seul.

M'enfin le truc était d'enfoncer le clou, marche-ce ?
ou bien traine-t'on encore des incorruptibles ?

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)

? avec quoi regardes-tu ?

il a donc bien analysé la nouvelle donnée MAIS n'en a pas tenu compte au
niveau UI...

Tu veux dire que ColorZilla (ou autre color picker) dis que c'est orange
alors que Fx continue à afficher du jaune ?

bon, maintenant que ça affiche les actions de modifs, on voit que le
change-menu-ok bégaie un peu :

BEFORE: div#menu dl dt:hover {
color: red; background-color: rgb(128, 128, 128);}
AFTER: div#menu dl dt:hover {
color: red; background-color: rgb(106, 202, 106);}
BEFORE: div#menu dl dt:hover {
color: red; background-color: rgb(106, 202, 106);}
AFTER: div#menu dl dt:hover {
color: rgb(255, 102, 0); background-color: rgb(106, 202, 106);}

ça aide peut-être le navigateur à comprendre ?

bizarre

Bon, ici :
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>
maintenant que mon navigateur a bien tout dans son cache,
le change-menu-ok ne prend que 2 ms
Je suis époustouflé !

--
sm

Vous avez filtré cet utilisateur ! Consultez son message

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)

Bon, si tu le dis :-)

tu es bien certain que tu as la même chose des 2 côtés ?

depuis tu nous a bien donné à manger et ... oui, il apparait que ce soit
bien copié-collé d'un côté (css) à l'autre (obj).

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...

Faut avouer que là encore tu as fait fort dans l'imbrication de balises html
Le Dom Inspector n'est pas perdu mais au déploiement du truc vaut mieux
suivre (le marrant étant les kgs de css qui s'appliquent à chaque
niveau)(je n'en reviens pas que les brouteurs s'en sortent).

ce qui est casse-pieds pour le débugage c'est qu'aucun des outils
d'analyse ne s'intéressent aux pseudo-class
(enfin ceux que j'ai et de la manière dont je les utilise)

Sur le papier ça semble OK.
bien qu'on n'ait pas trop le tremblement de :
setStyleSheetSelectorPropertyValue()

le tremblement ???

le contenu, le patafiolage, le schmillblick ... étoussa :-)

veut dire ?

Nan!
j'ai rien dit !
n'en jetez plus !
ça fait 15 pages écrit serré

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 ???

Le temps de traitement du clone doit être équivalent à celui de l'original,
le remplacement doit être immédiat ?
et puis ... 1/2 seconde pour suivre le tremblement et que le navigateur
opère les changements, je ne trouve pas ça lent.

S'il n'y a qu'une option de modif (ou même plus ?)
au onload yaka préparer le(s) clone(s) comme il faut et au click il n'y
aura plus qu'à faire le remplacement d'un coup d'un seul.

M'enfin le truc était d'enfoncer le clou, marche-ce ?
ou bien traine-t'on encore des incorruptibles ?

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)

? avec quoi regardes-tu ?

il a donc bien analysé la nouvelle donnée MAIS n'en a pas tenu compte au
niveau UI...

Tu veux dire que ColorZilla (ou autre color picker) dis que c'est orange
alors que Fx continue à afficher du jaune ?

bon, maintenant que ça affiche les actions de modifs, on voit que le
change-menu-ok bégaie un peu :

BEFORE: div#menu dl dt:hover {
color: red; background-color: rgb(128, 128, 128);}
AFTER: div#menu dl dt:hover {
color: red; background-color: rgb(106, 202, 106);}
BEFORE: div#menu dl dt:hover {
color: red; background-color: rgb(106, 202, 106);}
AFTER: div#menu dl dt:hover {
color: rgb(255, 102, 0); background-color: rgb(106, 202, 106);}

ça aide peut-être le navigateur à comprendre ?

bizarre

Bon, ici :
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>
maintenant que mon navigateur a bien tout dans son cache,
le change-menu-ok ne prend que 2 ms
Je suis époustouflé !

--
sm

unbewusst.sein

02/04/2008 à 19:21

SAM wrote:

Mieux vaut faire écrire qque part

bon, à la page
<http://thoraval.yvon.free.fr/Table_layout/table_layout.xhtml>

je "log" ce qui se passe avant et apres écriture...

--
Une Bévue

dom style et :hover ???

10 réponses

Veuillez sélectionner un problème