Aggiungere allowTransparency="true", tramite javascript, ad un iframe.

Printable View

03-09-2010, 14.16.39
darkwolf

Aggiungere allowTransparency="true", tramite javascript, ad un iframe.

Salve raga!
Ho messo il pulsante "mi piace", tramite l'iframe fornito da facebook, e lo ho "dinamicizzato" per la lingua, il referer e per gli url.
Funziona tutto, tranne per il fatto che allowTransparency="true" fa perdere la validazione del sito.
Ho provato convertendo l'iframe in object (e IE non lo vede - firefox e chrome ok), ho provato mettendo la trasparenza nel css (e anche qui, IE non la vede).
Insomma, ricordo che in passato affrontai con successo questo problema ma non ricordo come.
Pensavo di "inserire", tramite javascript, allowTransparency="true" se si usa IE e così me la risolvo perbene.

Codice:



ma, ovviamente, nonostante le ricerche fatte (probabilmente con query errate - ricordo che su questo forum fu postata una soluzione simile), non son riuscito a sistemare :|
03-09-2010, 14.48.02
karl94

Vuoi che lo script imposti l'attributo u tutti gli iframe o solo su uno specifico? Se sì, quale?
Edit: puoi anche fare così: anziché usare l'iframe usi l'object, Internet Explorer non saprà come visualizzarlo, così visualizzerà il contenuto dell'object, che sarà un commento condizionale con dentro l'iframe con l'attributo già impostato.
03-09-2010, 14.56.18
darkwolf

Gli posso attribuire un nome o una classe all'iframe (l'id no, nella index, ad esempio, è ripetuto più volte).
Avevo pensato alla soluzione "dentro object" ma il validatore si incazza comunque e quindi avevo pensato al javascript :)
03-09-2010, 15.19.03
javascripter

Ma l'id deve essere univoco, non puoi assegnare lo stesso id a più elementi.
03-09-2010, 15.21.58
darkwolf

Si, lo so, infatti dicevo di lavorare su classi :|
-
Nel precedente post mi sono espresso male(?).
Dicevo: non posso usare l'id dato che l'iframe è ripetuto più volte nella stessa pagina.
-
Insomma: potrei assegnare una classe all'iframe (che genera il pulsante "mi piace") e "iniettare" a tale classe l'allowtransparency="true"?
03-09-2010, 15.57.12
javascripter

Scusa, ho capito male io!

Si può fare:

Codice:



Questo all'interno di <head>, lo script funziona se assegni una sola classe.
03-09-2010, 16.14.25
darkwolf

Ottimo, verificato e operativo, grazie mille (unica pecca: carica senza sfondo e lo applica appena dopo - ma vabbé) :wink:
03-09-2010, 16.28.03
javascripter

Il problema è che lo script si avvia non appena la pagina è completamente carica.
Una soluzione alternativa può essere di richiamare lo script quando DOM è pronto, dato che si tratta solo di IE puoi usare:

Codice:

document.onreadystatechange = function() { if(this.readyState == 'complete') { var frames = document.getElementsByTagName('iframe'), cn = 'nome_classe'; for(var j in frames) { if(frames[j].className == cn) { frames[j].allowTransparency = 'true'; } } } }
03-09-2010, 16.37.50
darkwolf

Sinceramente, tra le due soluzioni, non noto alcuna differenza (funzionano esattamente alla stessa maniera) :|
03-09-2010, 16.56.15
javascripter

Cercando, ho trovato una funzione fatta apposta per internet explorer.
Se vuoi provare ( il codice diventa più o meno lungo ), questa dovrebbe essere la volta buona ( ho provato anche io ).

Codice:

/* * * IEContentLoaded.js * * Author: Diego Perini (diego.perini at gmail.com) NWBOX S.r.l. * Summary: DOMContentLoaded emulation for IE browsers * Updated: 05/10/2007 * License: GPL/CC * Version: TBD * */ // @w window reference // @fn function reference function IEContentLoaded (w, fn) { var d = w.document, done = false, // only fire once init = function () { if (!done) { done = true; fn(); } }; // polling for no errors (function () { try { // throws errors until after ondocumentready d.documentElement.doScroll('left'); } catch (e) { setTimeout(arguments.callee, 50); return; } // no errors, fire init(); })(); // trying to always fire before onload d.onreadystatechange = function() { if (d.readyState == 'complete') { d.onreadystatechange = null; init(); } }; } IEContentLoaded(window, function() { var frames = document.getElementsByTagName('iframe'), cn = 'nome_classe'; for(var j in frames) { if(frames[j].className == cn) { frames[j].allowTransparency = 'true'; } } });
03-09-2010, 17.04.03
darkwolf

Ho applicato il tutto e, pur essendo leggermente più veloce (almeno credo), rimane comunque un discreto lasso di tempo in cui è bianco (prova a vedere tu stesso, se puoi). Comunque, dico davvero, non è un gran problema. Se si ostinano a tenere IE, io non posso farci nulla :wink:
03-09-2010, 17.36.40
javascripter

Ho fatto vari tentativi, anche col metodo che ti ha suggerito karl94:

Codice HTML:

<object data="http://" style="border:none; overflow:hidden; width:450px; height:35px;">  </object>

E anche così per un piccolo lasso di tempo ( forse minore ) lo sfondo è bianco.
La differenza maggiore è che è un pò ridondante ( ripetere 2 volte la stessa cosa ma prima con <object> e poi con <iframe> ).
03-09-2010, 17.40.27
darkwolf

Allora lascio operativa la prima funziona (che mi sembra la più leggera) :wink:
Ancora una volta, grazie mille :)