Newsgroup: it.comp.lang.javascript
Titolo: Ottenere reale valore di un parametro CSS

Vi spiego la situazione:
Ho gia' provveduto a cercare e ad applicare varie soluzioni per ottenere 
i valori css applicati ad un tag html (nel mio caso un DIV), 
ma....quando cerco di ottenere il valore height o width, questi mi 
ritornano i valori in pixel che hanno attualmente e non il valore 
impostato nel CSS (esempioo 100% oppure 50% .....).
C'e' un modo per ottenere questi valori "reali" ?
cio' che uso io e':
document.defaultView.getComputedStyle(nds[i], 
"").getPropertyValue("height");
oppure:
nds[i].offsetHeight;
( dove nds[i] e' l'elemento attuale sul quale lavoro )
C'e' una qualche soluzione a cio' ?
ho anche googlato, ma non riesco a trovare nulla....anche perche' non mi 
riesco a capacitare di quali chiavi di ricerca utilizzare :(
Ciao & Grazie
		MaX

 riesco a capacitare di quali chiavi di ricerca utilizzare :(
Leggi i miei post di questo thread:
http://groups.google.it/groups?hl=it&lr=&c2coff=1&threadm=AvIOd.866852%2435.32988167%40news4.tin.it&rnum=1&prev=/groups%3Fhl%3Dit%26lr%3D%26c2coff%3D1%26selm%3DAvIOd.866852%252435.32988167%2540news4.tin.it
In realta' l'ultimo approccio (xbStylesheet) volevo migliorarlo, ma
dovrebbe essere ugualmente funzionale. Se usi quelle classi, una menzione
non mi farebbe schifo :)
P.S.
Per Cristiano, sperando che tu legga questo post, a questo punto puoi anche
pubblicarlo sul tuo sito cosi' com'e'; visto che non ho il tempo materiale
per fare cio' che avrei voluto.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 3 hours, 1 minutes and 56 seconds ago.

 per fare cio' che avrei voluto.
Ci sono 2 versioni nel post, quale metto? La seconda? Magari per esser
sicuri riposta quella "definitiva", oppure mandamela via mail
grazie
-- 
"E' l' ignoranza che crea l'intolleranza
 di gente cieca e senza coscienza"
									  S.S.S.

 sicuri riposta quella "definitiva", oppure mandamela via mail
Tu volevi quella piu' "organica" se ben ricordo, quella che faceva uso
delle "classi". Metti quella, e' anche la soluzione piu' generalizzata.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 3 hours, 13 minutes and 39 seconds ago.

 delle "classi". Metti quella, e' anche la soluzione piu' generalizzata.
Giusto per esser certi: questa?
function xbStyleSheet (obj){
 this.styleSheet=obj;
 this.cssRules=obj.rules||obj.cssRules||null;
 this.getRule=function(sSelector){
  sSelector=sSelector.toLowerCase();
  var i=0,rule=null;
 
  while (rule=this.cssRules[i++])
   if (rule.selectorText.toLowerCase()==sSelector)
    break;
 
  return rule||null;
 }
 return this;
}
document.getStyleSheetById=function(id){
 var obj=document.getElementById(id);
 return obj!=null&&(obj.styleSheet||obj.sheet)?new
xbStyleSheet(obj.styleSheet||obj.sheet):null;
}
E poi da codice:
<style type="text/css" id="default">
 div.test{
  font-size:10px;
 }
</style>
with (document.getStyleSheetById("default").getRule("div.test").style){
 fontSize="22px";
 color="red";
}
-- 
"Ti sei salvato
 o sei entrato in banca pure tu?"
									    A.V.

 Giusto per esser certi: questa?
Si, direi di si.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 3 hours, 19 minutes and 20 seconds ago.

 Si, direi di si.
Sto facendo dei test, un paio di dettagli.
a) non va con netscape6. So che è un po' uno schifo come browser, ho visto
però che basta cambiare 
   while (rule=this.cssRules[i++]) //segnala errore segnalando di mettere
== ...
con
   for(i;i<this.cssRules.length;i++) {
    rule=this.cssRules[i++];
e funziona correttamente anche con netscape6, quindi penso valga la pena
b) non funziona con Opera, neanche con la 7.54. Per questo per ora non ho
trovato rimedio. Qualche idea?
-- 
"Emancipate yourselves from mental slavery;
None but ourselves can free our minds"
									    B.M.

 trovato rimedio. Qualche idea?
Sai che io non supporto Opera per Javascript (o meglio, e' Opera che non
supporta Javascript, almeno desse uno stralcio di documentazione).
Comunque se vuoi gli daro' un'occhiata (dovrei avere installata la versione
7 da qualche parte).
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 5 hours, 33 minutes and 36 seconds ago.

 trovato rimedio. Qualche idea?
Non "funziona" perche' a quanto pare tale browser non supporta praticamente
una beneamata:
http://www.opera.com/docs/specs/js/dom/css/
Ergo i metodi delle classi restituiscono giustamente "null", in quanto
manca il supporto del browser.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 5 hours, 39 minutes and 36 seconds ago.

=7.54)...da quel che ho visto restituisce undefined sia per styleSheet che
per sheet.
-- 
"That until there is no longer first class
And second class citizens of any nation
Until the colour of a man's skin
Is of no more significance than the colour of his eyes
Me say war"
B.M.

 manca il supporto del browser.
Bene....
pubblico così (con la modifica per netscape6) e ciaociao Opera.
-- 
"Affacciati affacciati benedici, guardaci
 guardaci...guardaci!
 Tanto sono quasi duemila anni che stai a guardare!"
									    E.B.

 Purtroppo neanch'io, ma č abbastanza usato 
Infatti per quanto riguarda i siti lo supporto;faccio in modo che sia
ovviamente fruibile e accessibile anche da Opera, come qualsiasi altro
client. Solo che non lo supporto per Javascript.. visto che e' il browser
stesso in primis a non supportarlo.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 5 hours, 55 minutes and 41 seconds ago.

 La versione che ho io, si.
Io ho
  Netscape 6 Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; m18)
Gecko/20010131 Netscape6/6.01


 Gecko/20010131 Netscape6/6.01
Parrebbe la stessa:
Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; m18) Gecko/20010131
Netscape6/6.01
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 6 hours, 49 minutes and 39 seconds ago.

 cosě a naso
Facendo una rapida ricerca su internet, risulta un bug noto di Netscape
6/6.01 e Mozilla 0.8.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 6 hours, 53 minutes and 23 seconds ago.

 logica che adesso vado ad illustrarti.
[CUT]
Capito, capito...praticamente restituisce sempre l'ultimo rule trovato.
Potrei quindi mettere tra le ipotesi: non funziona con Opera collection
styleSheets non gestita), funziona con netscape6 solo se nella pagina vi è
un solo tag style...corretto?


 un solo tag style...corretto?
+ Mozilla>0.8 (stessa limitazione di netscape6) ? (ho installato sul pc
dalla 1.5 e funziona, non ho nulla prima)


 un solo tag style...corretto?
No, sbagliato:
Nella pagina vi possono essere anche miliardi di tag style, ma dovrebbero
avere UNA sola regola ciascuno. Direi che e' assurdo.
In sostanza, con N6, non funziona semplicemente il metodo "getRule" perche'
il browser non da' il supporto per il selectorText.
Quindi per usare lo script anche su N6, basta evitare l'uso del metodo
getRule e utilizzare unicamente la collection cssRules:
with ( document.getStyleSheetById("default").cssRules[0].style){
..
}
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 7 hours, 3 minutes and 31 seconds ago.

 ho installato sul pc dalla 1.5 e funziona, non ho nulla prima
A leggere sul web parrebbe che il bug sia solo fino alla 0.8, dopo e' stato
fixato.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 7 hours, 4 minutes and 43 seconds ago.

 No, sbagliato:
[CUT]
Sě, scusa, ti stavo rispondendo...č inapplicabile direi.
Scrivo NO Opera No Netscape6.x No Mozilla<=0.8.


 Sě, scusa, ti stavo rispondendo...č inapplicabile direi.
Beh, no, non e' inapplicabile.
Semplicemente nei browser "non bacati" puoi riferirti sia tramite selettore
che tramite indice; mentre nei browser bacati (N6/M0.8) solo tramite
indice.
Sarebbe come dire che ti riferisci ad un campo di recordset tramite chiave
o tramite indice, o ad un valore passato in post tramite chiave o tramite
indice.. la sintassi tramite indice e' applicabilissima, e su N6 funziona
tranquillamente. Anzi, e' piu' veloce perche' non deve iterare alcun che',
infatti se ti ricordi io consigliavo quella, nei casi "specifici" e non
generali.
E' errato dire che non funziona su tali browser, e' piu' corretto dire cosa
non va e perche'. Poi sta all'utente deciderne l'uso.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 7 hours, 21 minutes and 18 seconds ago.

 indice.
[CUT]
Ma allora non sarebbe meglio fare tutto via indice?
Altro pacco: id non è valido in tag style per xhtml, non mi valida la
pagina...
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.criosoftware.it%2Fpublic%2Fesempi%2FModificareCss.htm


 pagina...
A me lo valida tranquillamente come XHTML.
Probabilmente perche' tu usi lo strict o 1.1.
In ogni caso non e' un problema, quel codice e' perfettamente in grado di
funzionare sia con ID che senza. il getStyleSheetById e' un metodo
opzionale, e' una facilitazione; nel caso vi sia un ID associato ad un tag
STYLE.
Puoi benissimo fare, ad esempio:
var mystyle=new xbStyleSheet(document.styleSheets[0]);
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 7 hours, 41 minutes and 38 seconds ago.

 var mystyle=new xbStyleSheet(document.styleSheets[0]);
Sě...devo rivedere perň un po' la function che mi hai dato. Vado anche a
ripescare la prima che avevi postato che forse seguiva questa logica.
Bisogna ciclare la collection styleSheets per trovare la voce adatta, etc
etc...dopo guardo.
Per quanto riguarda il sito la validazione xhtml1.1 č obbligatoria.


 Per quanto riguarda il sito la validazione xhtml1.1 č obbligatoria.
Beh, quella e' una decisione tua. Ma magari gli utenti che cercano
"soluzioni" in javascript fanno siti che non utilizzano XHTML 1.1, ma XHTML
Transitional. Oppure HTML 4, o addirittura se ne fregano della validazione. 
Il codice che ho scritto funziona in tutti questi casi. Sta all'utente
decidere il tipo da approccio da usare, dipendentemente da come ha
strutturato il sito.
Quindi, se pubblichi tale codice, dovresti elencare le varie possibilita'.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 8 hours and 3 minutes ago.

 fixato.
Ho implementato la gestione del recupero di una rule tramite selector anche
su N6.
Dovrei fare qualche test in piu', ma parrebbe andare. Inoltre cosi', lo
sviluppatore puo' aumentare le performance se necessita un uso intenso
degli stylesheet.
Appena ti sei levato le complicazioni a lavoro, te ne parlo.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 8 hours, 37 minutes and 53 seconds ago.

 Appena ti sei levato le complicazioni a lavoro, te ne parlo.
Più o meno ci sono (rimandato a Sabato pomeriggio tutti i pacchi,
irrisolvibili a rete attiva).
-- 
"e mai che mi sia venuto in mente
 di essere più ubriaco di voi
 di essere molto più ubriaco di voi"
									  F.D.A.

 più compatibile e xhtml1.1.
Ma e' gia' usabile sotto xhtml 1.1. Rileggiti un attimo il post dove te lo
spiegavo, perche' mi sa' che non hai compreso..
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 8 hours, 49 minutes and 25 seconds ago.

 spiegavo, perche' mi sa' che non hai compreso..
Mi sa di sě, non ho ore da dedicarci purtroppo...ma se la soluzione č
l'alternativa della posizione ordinale secondo me č orrenda...tipica
situazione dove poi la grafica mi piazza un bel rule all'inizio e succede
un macello.


 un macello.
Suvvia, basta un po' di organizzazione. Per quanto mi riguarda, i css che
devo modificare a runtime li tengo sempre in un tag style separato da
quelli, invece, che non devono essere modificati. Ed io normalmente lavoro
da solo.. ma mi aiuta molto per la manutenzione.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 9 hours and 17 minutes ago.
on air ~ "no artist - AudioTrack 01"

 ordinale. I metodi nativi del DOM non ti mettono a disposizione altro.
Ho avuto bruttissime esperienze in passato (se non ricordo male prendevo il
valore di una td, non ricordo il perché, via posizione ordinale nella tr, e
un mio collega ha aggiunto una td vuota all'inizio per indentare...tra
l'altro, sempre se non ricordo male, era un prezzo; avendo slittato di uno
si finiva su una td che conteneva anch'essa un prezzo, solo che era il
costo anziché il prezzo all'utente finale...da qua in poi lascio a te
dedurre il delirio che ne č conseguito (vendite al costo, sempre se non
ricordo male). Da allora ho sempre evitato le posizioni ordinali come la
peste.)
Ognuno fa le sue esperienze, e da quelle deriva spesso l'uso o non uso di
una o l'altra logica (giusto o sbagliato che sia). 
Adesso poi che passo per la parte strettamente grafica da una terza parte
la situazione č piů complessa, ed eviterei ancora di piů.
Potrei pubblicare l'esempio via indice e stop, solo che non mi trova
d'accordo...Perň il metodo via id non č applicabile con xhtml1.1...
Devo ritagliarmi un po' di tempo e fare un po' di test fatti bene, ma
dubito in tempi brevi.


 quesito :(
Si, ero cecato io, qualche cosa ho trovato, ma non riesco a trovare come 
integrare il tutto nella mia situazione, ti/vi spiego:
con
	var nds = document.getElementsByTagName("div");
mi creo un array con tutti gli elementi DIV presenti nella pagina, poi 
con un ciclo for, ne controllo varie caratteristiche, tra cui devo 
riuscire a determinare il valore assegnato nel css di height e/o di width.
Quindi in definitiva in "mano" mi ritrovo nds[i] e da lui mi servirebbe 
estrarre il valore assegnato nel CSS.
Grazie infinite per l'interessamento.
  Ciao
      MaX

 
http://groups.google.it/groups?hl=it&lr=&c2coff=1&threadm=AvIOd.866852%2435.32988167%40news4.tin.it&rnum=1&prev=/groups%3Fhl%3Dit%26lr%3D%26c2coff%3D1%26selm%3DAvIOd.866852%252435.32988167%2540news4.tin.it
Saro' cecato, ma non son riuscito a trovare un riferiemento al mio 
quesito :(
Grazie infinite per l'interessamento.
Ciao
	MaX

 Potrei pubblicare l'esempio via indice e stop, 
Non capisco perche'. Il codice che ho scritto funziona SIA tramite indice
(e' nativo), SIA tramite selectorText. Espone entrambi i modi di lavorare
su CSS: laddove allo sviluppatore interessi il supporto per N6, utilizzera'
il riferimento via indice; mentre se non gli interessa potra'
tranquillamente utilizzare il selectorText.
(questo discorso ovviamente non tiene conto del workaround, che cmq rimane
- appunto - un workaround)
Stesso discorso per il supporto xhtml:
Se hai uno stylesheet con l'id associato, puoi utilizzare direttamente la
document.getStyleSheetById; altrimenti ti basta avere un riferimento
all'oggetto styleSheet e passare quello a xbStyleSheet.
Il codice non preclude affatto l'XHTML 1.1; e funziona benissimo anche in
assenza di ID.
Continuo a non capire, quindi, il tuo discorso sul "pero' il metodo via id
non e' applicabile con XHTML":
E' la stessa cosa del name per i form, alla fin dei conti.
In XHTML non c'e' il supporto per l'attributo name; ma questo non ti
preclude affatto l'uso di tale collection tramite indici, che funziona sul
piu' dei browser.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 9 hours, 42 minutes and 35 seconds ago.
on air ~ "Maki Kimura - Beyond The Bounds"

 Stesso discorso per il supporto xhtml:
[CUT]
Sě, solo che il sito č completamente xhtml e non voglio pubblicare nulla
che non lo sia.
E' solo un fattore del sito, non di cosa vuole fare l'utilizzatore: non
voglio pubblicare un esempio con dentro id nello style.
Potrei certo spiegare l'alternativa, ma per fare questo dovrei metter mano
un attimo al layout (e anche per questo ci vuole tempo, che non ho in
questo periodo).
Lasciamo quindi stare, io ero partito dal tuo messaggio "puoi pubblicarlo
nel tuo sito anche cosě com'č", ma purtroppo non posso pubblicarlo con l'id
nello stylesheet e non ce la faccio proprio a ricomporre il tutto.


 estrarre il valore assegnato nel CSS.
E infatti. Se e' impostato nel foglio di stile, e' in quest'ultimo che devi
andare a cercare. Non nell'oggetto. Tu nel foglio di stile gli dici che
l'altezza deve essere 25%. Quindi e' nel foglio di stile che c'e' questa
informazione. Nell'oggetto ci sara' il valore elaborato, ovvero l'altezza
in pixel del 25% del contesto in e' sta l'oggetto.
Se tu ce l'avessi impostato in line:
<div id="jehuty" style="width:50%">text</div>
L'avresti direttamente sull'oggetto stesso:
alert(document.getElementById("jehuty").style.width);
Ma se hai qualcosa tipo:
<style type="text/css">
	div#jehuty{
		width:50%;
	}
</style>
devi referenziare il foglio di stile in questione, recuperare la regola
relativa all'elemento che ti interessa, e da li' richiedere l'attributo
width.
Se non hai un riferimento diretto, e' "maiala". Perche' devi scorrerti
tutti gli stylesheet in cerca di ogni riferimento ai tag div, e poi
verificare se tali regole "matchano" con il tuo tipo di div, considerando
tutta la gerarchia precedente.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 9 hours, 56 minutes and 55 seconds ago.


 voglio pubblicare un esempio con dentro id nello style.
Devi solo scrivere un testo, quindi la validazione viene mantenuta.
Sarebbe come se tu non volessi usare il document.forms[] perche' "potrebbe"
essere usato anche con chiavi stringa invece che indici numerici..
Cmq lascia perdere, io pensavo di farti un favore, mica di incasinarti la
vita. :)
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 10 hours and 56 seconds ago.


 vita. :)
Sì, ehi non volevo certo essere aggressivo o offensivo, ci mancherebbe,
solo che oggi è una giornata no e (usando il solito francesismo, mi scusi
il Gentil Sesso) "se potessero attaccare una bobina ai miei coglioni con la
velocità di rotazione che hanno illuminerebbero metà Milano"...
Comunque appena trovo un attimo di tempo recupero i vari thread.
Grazie per le delucidazioni.


 velocità di rotazione che hanno illuminerebbero metà Milano"...
eheh..non preoccuparti, ti capisco, avevo messo lo smile apposta proprio
per evitare di essere frainteso.
-- 
ZER0
~ The Tangent Universe collapsed 5972 days, 10 hours, 17 minutes and 12 seconds ago.
on air ~ "U2 - Sunday, Bloody Sunday"

 
Per "riferimento diretto" cosa intendi precisamente ?
A parte questo, in generale mi sembra poco (o per nulla) attuabile 
quello che voglio fare....mannaggia :(
Ma e' possibile che questa necessita' non sia stata pensata quando han 
buttato giu' gli standard DOM ?
Va beh, peccato !
Grazie infinite
Ciao
	MaX

 buttato giu' gli standard DOM ?
L'hanno considerata, ma non come intendi tu.
Il punto e' che tu vorresti, da un oggetto HTML, recuperare i valori
definiti nel CSS, e che poi sono stati applicati all'oggetto. Ma stai
completamente sbagliando approccio, mischiando riferimenti a oggetti con
definizioni CSS.
-- 
ZER0://coder.gfxer.web-designer/
~ Alcune persone sono ancora vive per il semplice motivo che e'
illegale ucciderle.


Mi interessa fare una cosa del genere, perche' nella mia testa "bacata" 
:) ho immaginato di poter attivare delle ridimensioni a dei blocchi date 
certe condizioni.
Spiego:
se un DIV ha :
float: left|right
AND
height: 100%
AND
vertical-align: middle
(ma anche altre situazioni....che per non dilungarmi troppo non 
inserisco, questo gia' rende abbastanza bene l'idea)
applico l'altezza dell'oggetto padre che lo contiene al DIV in esame, mi 
calcolo i padding per centrare verticalmente il contenuto .
Perche' faccio cio' ? perche' vertical-align non allinea verticalmente 
gli oggetti e non c'e' soluzione possibile, se non usando 
"block:table-cell", ma e' poco supportata tra i vari browser, e perche' 
un oggetto float "esce" dall'impaginazione e non sa cosa voglia dire 100%
La cosa l'ho gia' fatta in un altro contesto, dove avevo messo in un 
array i blocchi a cui sapevo quando applicare tali ridimensionamenti, 
cosi' da impostare le cose per benino, e il tutto funzionava e funziona 
egregiamente.
Ora volevo fare una cosa piu' generica, e cioe' , non recuperando a 
quali div applicare tali regole in base ad un array, ma a tutti quei DIV
in cui vi fossero state solo una "concatenazione" di attributi impostati 
secondo certi valori.
Ecco tutto e scusate se son stato caotico, spero si capisca il succo del 
discorso.
Ciao
	MaX

 discorso.
Credo di si. :)
-- 
ZER0://coder.gfxer.web-designer/
~ Un computer e' fondamentalmente stupido.
Non fa cio' che vuoi che faccia, ma cio' che gli dici di fare.
Solo, e' uno stupido dannatamente veloce.

In data Mon, 7 Mar 2005 16:59:24 +0100, ZER0 ha scritto:
[CUT]
Rimosso id, inserito ciclo collection.
Vedi un po', cosa ne pensi? (mancherebbe il tuo work-around per netscape6).
Per Opera ho provato a tirar sů lo stylesheet con getElementsByTagName; li
trova, ma poi sembra non esporre un tubazzo di nulla...boh
http://www.criosoftware.it/public/esempi/ModificareCss.htm


 trova, ma poi sembra non esporre un tubazzo di nulla...boh
Ma è ovvio. Non hai letto il link del sito di Opera che ti ho postato? C'è
scritto chiaramente cosa espone e cosa no; e per quanto riguarda gli
stylesheet non c'è praticamente niente di supportato.
Per quanto riguarda il workaround è - appunto - un workaround, e non è
perfetto. L'ho fatto giusto per esercizio di stile.
-- 
.ZER0//sign
"When you have eliminated the impossible, whatever remains,
however improbable, must be the truth." (S.H.)

 selettore. Utilizzando il tuo approccio otterrei solamente il primo.
Sì, è vero. Ma, se non ho capito male, seguendo il tuo non lo becco se si
trova nel secondo tag style.


 trova nel secondo tag style.
Leggi su. Sarebbe come dire che "con il mio codice non becco 'pippo' se si
trova nella seconda form e non nella prima". E ovvio, ma in tal caso, non
referenzi la prima form bensì la seconda.. non ti pare?


 che incontri.
Sì, vero, questo è un limite dello script ma IMHO è accettabilissimo.
Dovrei provare, ma se ho 2 style con lo stesso rule e setto delle
proprietà, e la stessa si trova nel secondo...boh
<style>
 div.test {display:inline}
</style>
<style>
 div.test {font-size:12px}
</style>
Se becco il primo rule e setto font-size:22px immagino funzioni
correttamente...o no?


 correttamente...o no?
Assolutamente no.
Infatti la seconda regola "sovrascrive" la prima, quindi se imposti anche
dinamicamente un font-size nella prima, questo viene cmq "ignorato" a conti
fatti, perché esiste una regola successiva che lo "re-imposta".
Inoltre, ti stai limitando ad una sola visione delle cose.
La classe che ho realizzato, serve a riferirsi ad un oggetto stylesheet ed
alle regole ad esso associato in modo cross-browser.
Non serve solo a "modificare un css". Quello è un aspetto della cosa, ma
non l'unico.
Mettiamo che io voglia *recuperare* un valore impostato nel css.. vedasi ad
esempio il post che ha fatto nascere tutto questo discorso. Per come tu hai
rimaneggiato il codice, avrei seri problemi nel farlo: otterrei la prima
regola chiamata "div.test", che non contiene il valore che mi interessa
(font-size).


On Sat, 12 Mar 2005 16:39:27 GMT, ZER0 wrote:
[cut]
Ora sono in partenza; lunedì pubblico delle modifiche applicate alla mia
classe, che dovrebbero farti un po' più "contento"; senza per questo
snaturare alcunché.
E se ce la faccio implemento un paio di metodi nuovi.


 E se ce la faccio implemento un paio di metodi nuovi.
Ah ok, allora aspetto a pubblicare il tutto. Letto quello che dici, sono
d'accordo più o meno su tutto ma resta il fatto che IMHO usare posizione
ordinale è pericolosissimo.
Nel caso posso inserire entrambe le strade con scritti i pro e contro.


 Nel caso posso inserire entrambe le strade con scritti i pro e contro.
Brr.. personalmente rabbrividisco nel sapere che un mio codice possa
generare una cosa del genere :P
-- 
ZER0
~ The Tangent Universe collapsed 5979 days, 3 hours, 47 minutes and 4 seconds ago.

 nel transitional) 
Tra l'altro, sbaglio o pure il sito del 
w3.org
 non fa uso dell'XHTML 1.1?
:)
-- 
ZER0
~ The Tangent Universe collapsed 5979 days, 4 hours, 10 minutes and 4 seconds ago.

 :)
:-)
Il problema è "solo" mio, nel senso che quel sito è nato proprio per test
vari xhtml1.1 e vorrei (leggasi "voglio") mantenerlo tale.
Posso quindi mettere nella pagina descrittiva entrambi i casi, poi
nell'esempio lasciare entrambi ma non mettere id allo style (indicherò
magari: "per usare get...ById mettere id allo style).


 :)
Ne il validatore (
validator.w3.org
), ne il sito (
www.w3.org
), sono riuscito
a scovare le pagine con il doctype dell'XHTML 1.1 solo nella TR.. almeno
nel validatore potevano cambiare la DTD.. ^_^
-- 
ZER0
~ The Tangent Universe collapsed 5979 days, 4 hours and 13 minutes ago.

 E se ce la faccio implemento un paio di metodi nuovi.
Purtroppo ho avuto un po' di lavoro da fare. Ho solo implementato un
metodo,che è quello di cui ti parlavo, e modificato il ciclo: Aggiungendo
questo metodo, devo poter ciclare la collection anche su N6, quindi non
potevo più utilizzare il while() come prima, per il bug noto.
Ma dovrei aver trovato un buon compromesso. Dovrei ancora ottimizzare
qualcosa, ma dovrebbe andarti più che bene adesso:
function xbStyleSheet (obj){
	this.styleSheet=obj;
	this.cssRules=obj.rules||obj.cssRules||null;
	this.getRule=function(sSelector){
		sSelector=sSelector.toLowerCase();
  		for (var
i=this.cssRules.length,rule=null;i>0&&(rule=this.cssRules[--i]);)
			if (rule.selectorText.toLowerCase()==sSelector)
				break;
			else
				rule=null;
		return rule;
	}
	return this;
}
document.getStyleSheetById=function(id){
	var obj=this.getElementById(id);
	return obj!=null&&(obj.styleSheet||obj.sheet)?new
xbStyleSheet(obj.styleSheet||obj.sheet):null;
}
document.getStyleSheetByTitle=function(sTitle){
	if (typeof this.styleSheets!="undefined" && this.styleSheets.length>0)
		for (var
i=this.styleSheets.length,style=null;i>0&&(style=this.styleSheets[--i]);)
			if (style.title==sTitle)
				return new xbStyleSheet(style);
	return null;
}
NB
Non ho inserito il workaround per le "rule" in Netscape 6, perché non mi
convince, quindi lo script è usabile anche in N6, ma le rule vanno
recuperate in modo ordinale per via del bug sul selectorText.
Fai presente questo, nella pagina in cui poni lo script.
-- 
ZER0
~ The Tangent Universe collapsed 5981 days, 11 hours, 47 minutes and 30 seconds ago.

 potevo più utilizzare il while() come prima, per il bug noto.
[CUT]
Allora, fatta pagina con 3 metodi, vedi cosa ne pensi:
 
http://www.criosoftware.it/public/esempi/ModificareCss.htm
2 domande/problemi:
a) vedi
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.criosoftware.it%2Fpublic%2Fesempi%2FModificareCss.htm
  Non me la valida per la parte javascript. Mi è già capitata una cosa
simile, hai idea su come risolvere? Ci vorrebbe penso un <![CDATA[ ma se lo
metto fa casini...
b) nel codice di esempio volevo, per riprodurre il quarto caso (via id),
settare l'id onload (così resta l'esempio pratico e evito problemi
xhtml1.1).
 window.onload=function() {
 if(!window.opera)
  document.styleSheets[1].setAttribute("id","IDMyStyle");
}
Niente da fare, non funziona...qualche idea?
Grazie


 Niente da fare, non funziona...qualche idea?
Stai cannando riferimento. Così ti riferisci ad un oggetto stylesheet, non
all'elemento che lo contiene. Nel tuo caso puoi fare:
document.getElementsByTagName("style")[1].setAttribute("id","IDMyStyle");
Venendo alla pagina: Per com'è messo il codice sembra che
"getStyleSheetByTitle" non funzioni con N6/M0.8, e che si debba sempre
usare il riferimento in modo ordinale, sia per referenziare lo stylesheet
che la rule.
In verità non è così. Bisognerebbe precisare le seguenti cose:
a) getStyleSheetById funziona laddove l'elemento che contiene lo stylesheet
ha l'attributo "ID". Se la DTD non lo contempla (tag STYLE. solo XHTML 1.1
al momento) è possibile riferirsi allo stylesheet in modo ordinale, o
attraverso il title (getStyleSheetByTitle).
Questo non ha niente a che vedere con il browser (basta che abbia il
supporto per gli stylesheet ovviamente), ma con il codice scritto.
Quindi questi metodi funzionano anche su N6/M0.8.
Se non usi XHTML 1.1, puoi utilizzare il getStyleSheetById, ad esempio.
Oppure, se utilizzi XHTML 1.1 puoi NON usare il tag style, ma il tag LINK,
che mi pare supporti ancora l'attributo ID.
Questo per farti capire che è una questione inerente al codice di markup, e
non tanto di browser in sè.
b) getRule funziona su tutti i browser che hanno il supporto per gli
stylesheet, tranne N6/M0.8 perché un bug presente in tali versioni non
espone la proprietà selectorText, rendendo quindi impossibile capire il
selettore di una regola.
Se si desidera scrivere codice che funzioni anche su tali versioni, non è
possibile utilizzare il getRule(), in quanto ritornerebbe sempre "null", ma
utilizzare la collection cssRules che l'oggetto mette a disposizione per
recuperare le regole in modo ordinale.
Attenzione, che questo metodo non ha nulla a che vedere con il "come" io
creo l'oggetto xbStyleSheet. Posso quindi crearlo tramite id, title o in
modo ordinale. Anche in N6/M0.8. Solamente le regole, in presenza di
quest'ulttimi due browser, possono essere referenziate solo tramite indice
numerico.
-- 
ZER0
~ The Tangent Universe collapsed 5983 days, 4 hours, 55 minutes and 11 seconds ago.

 In verità non è così. Bisognerebbe precisare le seguenti cose:
[CUT]
Vedi un po' adesso la pagina, ho tolto scritte nel tasto e messo note a
fondo pagina.
Per la sostituzione style con link ho scritto che va testata come
alternativa valida (+ setAttribute() come da script nella pagina).
Fammi sapere (poi dovrò trovare un attimo per scrivere la pagina, ma
metterò comunque 2 considerazioni generali e rimanderò al download
dell'esempio).
Dimmi anche se vuoi che anche nel file di download (quello che stiamo
testando) vuoi che metto un tuo riferimento; se sì cosa? Metto come nelle
pagine un "grazie a" con link a mail?
-- 
"e mai che mi sia venuto in mente
 di essere più ubriaco di voi
 di essere molto più ubriaco di voi"
									  F.D.A.

 pagine un "grazie a" con link a mail?
Si, non ho altre cose particolari da metterci,per il momento.
-- 
ZER0
~ The Tangent Universe collapsed 5986 days, 2 hours, 5 minutes and 8 seconds ago.

In data Mon, 21 Mar 2005 08:47:20 +0100, ZER0 ha scritto:
[CUT]
 
http://www.criosoftware.it/default23.aspx
