Newsgroup: it.comp.lang.javascript
Titolo: spoiler e problemi con internet explorer

<div class="pre-spoiler"><input type="button" value="Mostra spoiler"
style="width:100px;font-size:10px;margin:0px;padding:0px;" onclick="if
(this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
!= '') {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
= '';this.innerText = ''; this.value = 'Nascondi spoiler'; } else {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
= 'none'; this.value = 'Mostra spoiler';}"> </div> <div> <div
class="spoiler" style="display: none;">{TEXT}</div> </div>
l'ho testato con Opera, Safari, FF e Chrome: una favola
invece con IE ha un problema, ossia quando apro lo spoiler per visualizzare
il resto del testo, questo va a sovrascriversi al footer cenerando un
pastroccio esagerato.
Magari chi meglio di voi potrebbe aiutarmi ad apportare una qualche modifica
al codice per renderlo digeribile anche a quella grande rottura di palle che
� InternetExplore.
grazie per l'attenzione.
Mario

 esagerato.
Beh, ho fatto copia-incolla di quel che hai postato e va tutto ... se 
puoi metti online un esempio semplice (ma completo) che riproduca il 
problema.

 ha scritto nel messaggio 
news:ibbltl$bc6$1...@news.eternal-september.org...

dovrei postare il link del mio sito-blog ma credo che rischierei d'essere 
accusato di spam :)
comunque sia vorrei aggiungere una cosa: ho rinunciato ad usare quel codice 
e siccome uso WordPress ho scaricato un suo plugin che si chiama Advanced 
Spoiler pensando anche potesse essere ottimizzato per tutti i browser, 
invece si è ripetuto il problema: funzionamento eccellente con *tutti* i 
browser ad eccezione di InternetExplorer infatti il problema è sempre lo 
stesso.
Mi chiedo se per caso conosci uno script, un codice, un plugin, quello che 
ti pare da testare.
Grazie per la collaborazione.
mario 

 che ti pare da testare.
No ... ma non ho capito cosa vuoi fare: semplicemente clicchi su un tasto 
e visualizzi la voce nascosta subito dopo? Sono lo stesso tag? Uno dopo 
l'altro?
Prova a cercare "jquery toggle" ... però va integrato con wordpress, 
cerca che vedrai che si può (sempre che jquery non sia già nel core, in 
Drupal p.e. lo è)

 Il Tue, 09 Nov 2010 18:15:19 +0100, Kundalini - colui il quale un tempo si

qui c'è un esempio di come questo spoiler funzioni male con internet 
explorer ...
http://sparatutto.net/test/
mario 

 
http://sparatutto.net/test/
Mah ... a mio avviso è la parte CSS che è fatta male.
Manca per esempio un clear:both al footer, forse risolvi semplicemente 
aggiungendo questo.

 ha scritto nel messaggio 
news:ibdrep$r83$1...@news.eternal-september.org...

grazie, lo proverò
mario 

 grazie, lo proverò
fai sapere se era quello il problema

 ha scritto nel messaggio 
news:ibdrep$r83$1...@news.eternal-september.org...

ci ho provato ma niente da fare
grazie lo stesso ovviamente :)
mario 

 grazie lo stesso ovviamente :)
hai cancellato la pagina di test ... ok.

 ha scritto nel messaggio 
news:ibe4ib$oi0$2...@news.eternal-september.org...

ooops ... scusa, se vuoi la rimetto subito, se vuoi dare ancora un'occhiata 
mi faresti un grandissimo piacere
mario 

 un'occhiata mi faresti un grandissimo piacere
se puoi lasciarla qualche tempo, appena riesco ci dò una occhiata, però è 
sicuramente un problema di css, non di javascript.

 ha scritto nel messaggio 
news:ibe62d$6uv$1...@news.eternal-september.org...

http://sparatutto.net/prove-tecniche/
è una pagina privata. Non so per quale motivo lo puoi visualizzare con IE e 
Chrome ma non con FireFox.
grazie per l'interessamento.
nb. in questo esempio c'è un plugin di wordpress per lo spoiler, ma l'errore 
dato in internet explorer è lo stesso, ma credo che per te non faccia 
differenza visto che il problema sta nel css (almeno con IE)
mario 

 IE e Chrome ma non con FireFox.
Sicuro che non stai guardando la cache? perché a me scrive "page not 
found" sia con firefox che con IE ...

 ha scritto nel messaggio 
news:ibedoj$v2e$1...@news.eternal-september.org...

http://sparatutto.net/prove-tecniche/
password: pippo
mario

"Kundalini - colui il quale un tempo si faceva chiamare Mariovic" 
<kund...@kundalini.ku> ha scritto nel messaggio 
news:ibeel7$jjm$1...@nnrp-beta.newsland.it...

noterai che sebbene adesso stia utilizzando un plugin di wordpress e non 
quel codice che ho postato inizialmente, l'errore è sempre lo stesso e si 
verifica solo su Internet Explorer. Adesso capisco il css non sia 
impeccabile, però mi pare molto strano che tutti gli altri browser lo 
interpretino correttamente.
mario 

 password: pippo
il css è un po' un casotto, e non capisco bene il perché si comporti così.
Il modo più veloce per risolvere che ho trovato è questo:
file jquery-spoiler.js
Nella function showide nascondi il footer e rivisualizzalo, in questo 
modo sembra che IE lo rivisualizzi correttamente.
Diventa quindi
showhide: function(el){
                               if(el.css('display') != 'none') el.css
('display', 'none');
                               else el.css('display', '');
                               jQuery('#footer').css('display','none');
                               setTimeout("jQuery('#footer').css
('display','block')",1);
 
                },

 ha scritto nel messaggio 
news:ibem40$ec3$1...@news.eternal-september.org...

caspita sei un drago, proverò ad apportare queste modifiche e ti farò sapere 
:)
mario 

 sapere :)
aspetta a dirlo, prima prova ... :-)

 Il Wed, 10 Nov 2010 19:03:36 +0100, Kundalini - colui il quale un tempo si

per adesso ho solo dato un'occhiata velocissima. Ho cenato per affrontare 
meglio il "nemico" :) Ma a momenti c'è anche l'infra-campionato di serie A 
per i malati di calcio come il sottoscritto.
Nota pessimistica: ho paura che non avrò idea di dove mettere le mani.
Devo intervenire unicamente su style.css o su cosa? Boooh! Questa roba 
purtroppo non è il mio forte.
mario 

"Kundalini - colui il quale un tempo si faceva chiamare Mariovic" 
<kund...@kundalini.ku> ha scritto nel messaggio 
news:ibeqst$r5g$1...@nnrp-beta.newsland.it...

aspetta adesso ci sono, tu praticamente sei andato a vedere il plugin, non 
il css del template, giusto?
mario 

 non il css del template, giusto?
Non so se è il plugin, è il file jquery-spoiler.js dove devi provare solo 
ad aggiungere quelle due righe

 non il css del template, giusto?
Non so se è il plugin, è il file jquery-spoiler.js dove devi provare solo 


 ha scritto nel messaggio 
news:ibersv$5rv$1...@news.eternal-september.org...

non va purtroppo
l'ho modificato così
var Spoiler = {
 timer: 0,
 setOption: function(options) {
  var newOptions = Object.extend(options||{}, arguments[1]||{});
  return newOptions;
 },
 _start: function() {
  jQuery('a.spoiler-tgl').each(function(i){
   var el = jQuery('#'+jQuery(this).attr('id').replace('_tgl', ''));
   var opt = jQuery(this).attr('rev').split('||');
   this.onclick = function(){Spoiler.plugin(el, jQuery(this), opt); return 
false;};
   if(el.css('display') != 'none') {
    Spoiler.plugin(el, jQuery(this), opt);
   }
  });
 },
 start: function() {
  jQuery('a.spoiler-tgl').each(function(i){
   var tglr = jQuery(this);
   var el = tglr.parent('p:first').next('div.spoiler-body:first');
   if (!el.length)
    return;
   var opt = tglr.attr('rev').split('||');
   tglr.click(function(){
    Spoiler.plugin(el, jQuery(this), opt); return false;
   }).focus(function(){this.blur()});
   if(el.css('display') != 'none') {
    tglr.toggleClass("collapsed");
    el.hide();
   }
  });
 },
 showhide: function(el){
if(el.css('display') != 'none') el.css('display', 'none');
else el.css('display', '');
jQuery('#footer').css('display','none');
setTimeout("jQuery('#footer').css
('display','block')",1);
 },
 //Effects
 Simple: function(el){
  this.showhide(el);
 },
 Appear: function(el, dur){
  el.fadeIn(dur);
 },
 Fade: function(el, dur){
  el.fadeOut(dur);
 },
 SlideDown: function(el, dur){
  el.slideDown(dur);
 },
 SlideUp: function(el, dur){
  el.slideUp(dur);
 },
 BlindDown: function(el, dur){
  el.css({marginTop:-el.outerHeight()}).show().wrap('<div 
class="spoiler_outer_box"></div>').
   animate({marginTop:'0'}, dur, function(){
    jQuery(this).css({marginTop:''}).parent('.spoiler_outer_box').before(this).remove();
  });
 },
 BlindUp: function(el, dur){
  el.wrap('<div class="spoiler_outer_box"></div>').
   animate({marginTop: -el.outerHeight()}, dur, function(){
    jQuery(this).hide().css({marginTop:''}).parent('.spoiler_outer_box').before(this).remove();
  });
 },
 PhaseIn: function(el, dur){
  el.animate({height: "show", opacity: "show"}, dur);
 },
 PhaseOut: function(el, dur){
  el.animate({height: "hide", opacity: "hide"}, dur);
 },
 PAIR: {
 'slide': ['SlideDown','SlideUp'],
 'blind': ['BlindDown','BlindUp'],
 'appear': ['Appear','Fade'],
 'phase': ['PhaseIn','PhaseOut'],
 'simple': ['Simple','Simple'],
 'apblind': ['Appear','BlindUp']
 },
 toggle: function(el, effect, dur) {
  if (!dur) dur = 'normal';// 0 or undefined
  if (dur < 0) dur = dur * 1000;
  if (dur < 10) dur = dur * 100;
  if (dur > 700) dur = 'slow';
  if (dur < 200) dur = 'fast';
  effect = (effect || 'appear').toLowerCase();
  Spoiler[(el.css('display') != 
'none')?Spoiler.PAIR[effect][1]:Spoiler.PAIR[effect][0]](el, dur||400);
 },
 Collapse: function(el, effect, me, dur) {
  Spoiler.toggle(el, effect, dur);
  jQuery(me).toggleClass("collapsed");
 },
 plugin: function(el, tid, opt){
  if (el.css('display') != 'none') {
   tid.html(opt[1]);
  } else {
   tid.html(opt[2]);
  }
  tid.toggleClass("collapsed");
  Spoiler.toggle(el, opt[0], parseInt(opt[3]));
 }
};
jQuery(document).ready(function() { Spoiler.start(); });

 ('display','block')",1);
Senza andare a capo qua sopra, vero?
Dato che prima avevo giocato con i css, magari qualche modifica che avevo 
fatto serviva. Volevo riprovare, ma nuovamente la pagina è scomparsa...

 ha scritto nel messaggio 
news:ibg6cl$qk7$1...@news.eternal-september.org...


scusa hai ragione, ecco un altro link che ti posso lasciare in rete: il 
template e il plugin sono gli stessi
http://dimagrire.hellospace.net/test/
buona fortuna e grazie ancora :)
mario 

 ha scritto nel messaggio 

per piacere puoi vedere se per caso ci sono errori? Ho sbagliato ad andare a 
capo da qualche parte?

 showhide: function(el){
if(el.css('display') != 'none') el.css('display', 'none');
else el.css('display', '');
jQuery('#footer').css('display','none');
setTimeout("jQuery('#footer').css
('display','block')",1);

jQuery(document).ready(function() { Spoiler.start(); });
p.s. - comunque ho testato lo stesso plugin (originale senza la tua 
modifica) in un altro template e funziona correttamente anche in internet 
explorer.
A questo punto avevi ragione a dire che il problema risiede nel codice del 
footer
questa è la parte inerente il css
/* FOOTER */
#footer {
 padding: 28px 0;
 text-align: center;
 color: #c7c1b3;
 font-size: 13px;
    background: url(images/footer-background.png) left center repeat-x;
    margin-top: 10px;
 }
#footer a {
 color: #c7c1b3;
 }
#footer a:hover {
 text-decoration: none;
    color: #c7c1b3;
 }
#footer2 {
 color: #89857a;
 font-size: 11px;
 text-align: center;
 padding: 10px;
 }
#footer2 a {
 color: #89857a;
    text-decoration: none;
 } 

 ('display','block')",1);
io questa riga sopra la vedo a capo, ma non so se sia vero o se è colpa 
del newsreader ... comunque sia, firefox ti segnalerebbe un bell'errore 
nella console ...

 ha scritto nel messaggio 
news:ibgr11$uft$1...@news.eternal-september.org...


non ci capisco più nulla, mi puoi ripostare tutto il codice come dovrebbe 
essere?
inoltre hai già dato un'occhiata al css che ti ho postato?
mi serve un té alle multivitamine :)
mario 

 dovrebbe essere?
Mi spiace, ci rinuncio. il codice è troppo incasinato e sinceramente non 
ho tempo.
Ogni tanto va ogni tanto no; ogni tanto sembra usare la function showHide 
e ogni tanto la function plugin ... ho messo quelle 2 righe nella plugin 
e sembra funzionare, se non chè con IE, quando nascondi, il body resta 
lungo ... Occorrerebbe lavorarci bene e sistemare il layout, ma appunto i 
css sono troppi e troppo incasinati per riuscire in poco tempo a capirci 
qualcosa.
Se ti va bene che il body resti "allungato", allora la mia soluzione 
sembra andare mettendo però le due righe nella function plugin anziché 
showHide.

 Il Thu, 11 Nov 2010 14:42:57 +0100, Kundalini - colui il quale un tempo si


si è davvero un gran casino, proverò a ovviare in qualche modo prima o poi.
Grazie molte per la disponibilità. Mi hai aiutato ad avere le idee più chire 
su
dove risiede il problema.
ciao
mario