Condividi:        

Countdown in Javascript, problemi con IE7

Problemi di HTML? Di PHP, ASP, .NET, JSP, Perl, SQL, JavaScript, Visual Basic..?
Vuoi realizzare programmi in C, C++, Java, Ruby o Smalltalk, e non sai da che parte cominciare?
Entra qui e troverai le risposte!

Moderatori: Anthony47, Triumph Of Steel, archimede

Countdown in Javascript, problemi con IE7

Postdi nimeha » 22/09/08 21:47

Ciao a tutti,

sto preparando un sito per il mio matrimonio... :P (ebbene si, mi sposo...)
cmq per tornare al sodo: ho deciso di avvalermi di un servizio che mi mette a disposizione praticamente tutto,
dal dominio allo spazio illimitato passando per il layout e un sacco di servizi!

Ora però il mio problema.. visto che il sito è inglese, loro offrivano un counter al matrimonio che rimaneva in parte in iglese, del tipo: "You still have ..... until il mio matrimonio" :eeh:
Come potrete immaginare non volevo tenermi un "coso" simile sul sito.. e quando ho scoperto che nella personalizzazione delle pagine potevo inserire un po' di HTML e qualche script mi sono organizzata e ho trovato due script che farebbero entrambi al caso mio..
Il problema è che nell'anteprima in Firefox il sito di vede benissimo... nell'anteprima IE7 lo script mi sballa il layout del sito! :aaah

Non so come risolvere, e tenete conto che non posso applicare modifiche alla pagina intera ma solo al blocco di contenuto centrale..

Per capirci, ecco il link all'anteprima: http://effepisposi.wedshare.com/home.html
Ed ecco due snaps:
Immagine Immagine

Qui il codice che ho usato per questo script:
Codice: Seleziona tutto
<head>
<style type="text/css">
.style1 {
   text-align: center;
}
</style>
</head>

<p class="style1"><span style="font-family: 'Trebuchet MS'; font-size: 12pt; color: #846344; border: 2pt solid

#846344; padding: 2px; background-color: #FBF0E0; font-weight: bold;">
<html>
<body><script name="JavaScript">
<!--
oggi = new Date()          
altra_data = new Date("mAy 30, 2009")   
altra_data.setYear = oggi.getYear;      
giorni = (altra_data.getTime() - oggi.getTime()) / (1000*60*60*24);
giorni = Math.round(giorni);
document.write("Mancano ancora "+giorni+" giorni al nostro matrimonio!");
// -->
</script></body></html>

E questo, invece, e l'altro codice che ho provato, e che mi da lo stesso tipo di inconveniente in IE7.. :cry:
Codice: Seleziona tutto
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<script type="text/javascript">
var futureyear=2009
var futuremonth=4
var futureday=30
var displaytype="vediall"
var digitordate="isdate"
var aftercountdown="stopit"
var digitfrom=100
var digitto=0
var speed=1

var countdownid=new Array()
var futuredate
var nowdate
var resultoreraw
var resultore
var resultminutiraw
var resultminuti
var resultsecondiraw
var resultsecondi

var p_secondi
var p_minuti
var p_ore
var p_giorni

var resultsecondionly
var resultminutionly
var resultoreonly
var content

var i_countdown=-1
var countdownid

var step=1
speed*=1000

if (digitfrom>digitto) {step=-1}
if (digitfrom<digitto) {step=1}

var browserinfos=navigator.userAgent
var ns4=document.layers
var ie4=!document.getElementById&&document.all&&!browserinfos.match(/Opera/)
var ie5=document.getElementById&&document.all&&!browserinfos.match(/Opera/)
var ns6=document.getElementById&&!document.all&&!browserinfos.match(/Opera/)
var opera=browserinfos.match(/Opera/) 

function setfuturedate() {
   futuredate=new Date(futureyear,futuremonth,futureday,0,0,0)
   if (digitordate=="isdigit") {content=digitfrom-step   }
   docountdown()
}

function docountdown() {
   if (digitordate=="isdate") {
      calculateresults()
      formatresults()
      displayresults()
      setTimeout("docountdown()",speed)
   }
   else if (digitordate=="isdigit") {
      content+=step   
      displayresults()
      if (content==digitto) {
         setTimeout("happensafter()",speed)
      }
      else {
         setTimeout("docountdown()",speed)
      }
   }
}

function firstcountdown() {
   if (digitordate=="isdate") {
      futuredate=new Date(futureyear,futuremonth,futureday,0,0,0)
      calculateresults()
      formatresults()
   }
   else if (digitordate=="isdigit") {
      content=digitfrom
   }
}

function calculateresults() {
nowdate=new Date()
resultgiorniraw=(Date.parse(futuredate)-Date.parse(nowdate))/1000/60/60/24
if (displaytype!="vediall") {
   resultsecondionly=Math.floor((Date.parse(futuredate)-Date.parse(nowdate))/1000)
   resultminutionly=Math.floor((Date.parse(futuredate)-Date.parse(nowdate))/1000/60)
   resultoreonly=Math.floor((Date.parse(futuredate)-Date.parse(nowdate))/1000/60/60)
}
else {
   resultgiorni=Math.floor((Date.parse(futuredate)-Date.parse(nowdate))/1000/60/60/24)
   resultoreraw=(resultgiorniraw-resultgiorni)*24
   resultore=Math.floor((resultgiorniraw-resultgiorni)*24)
   resultminutiraw=(resultoreraw-resultore)*60
   resultminuti=Math.floor((resultoreraw-resultore)*60)
   resultsecondiraw=(resultminutiraw-resultminuti)*60
   resultsecondi=Math.floor((resultminutiraw-resultminuti)*60)
   }
}

function formatresults() {
   if (displaytype=="vediall") {
      if (resultgiorni>1) {p_giorni="giorni"}
      else {p_giorni="day"}
      if (resultminuti<10) {resultminuti="0"+resultminuti}
      if (resultsecondi<10) {resultsecondi="0"+resultsecondi}
      content=resultgiorni+" "+p_giorni+" "+resultore+"h "+resultminuti+"m "+resultsecondi +"s"
   }
   else if (displaytype=="vedigiorni") {
      if (resultgiorni>1) {p_giorni="giorni"}
      else {p_giorni="day"}
      content=resultgiorni+" "+p_giorni
   }
   else if (displaytype=="vediore") {
      content=resultoreonly+" Ore"
   }
   else if (displaytype=="vediminuti") {
      content=resultminutionly+" min"
   }
   else if (displaytype=="vedisecondi") {
      content=resultsecondionly+" sec"
   }
}

function happensafter() {
   if (aftercountdown=="repeatit") {
      if (digitordate=="isdigit") {content=digitfrom-step}
      docountdown()
   }
   if (aftercountdown!="stopit" && aftercountdown!="repeatit") {
      document.location.href=aftercountdown
   }
}

function displayresults() {
   if (ie4) {
      for (i=0;i<=countdownid.length-1;i++) {
         var thisclock=eval(countdownid[i])
         thisclock.innerHTML=content
      }
   }
   else {
      for (i=0;i<=countdownid.length-1;i++) {
         document.getElementById(countdownid[i]).innerHTML=content
      }
   }
}

function setcountdown() {
   if (ns4 || ie4 || ie5 || ns6 || opera) {
      firstcountdown()
      i_countdown++
      countdownid[i_countdown]="countdown"+i_countdown
      document.write("<span id='"+countdownid[i_countdown]+"'

style='position:relative'>"+content+"</span>")
   }
}

if (ie4 || ie5 || ns6 || opera) {
   onload=setfuturedate
}
</script>
</head>

<body><p><font face="Trebuchet MS, Helvetica, sans-serif" color="#800000" size="2">Mancano ancora...</font></p>
<span style="border: 2pt solid rgb(132, 99, 68); padding: 2px; font-family: 'Trebuchet MS'; font-size: 12pt;

color: rgb(132, 99, 68); background-color: rgb(251, 240, 224); font-weight: bold;">
<script type="text/javascript">
<!--
setcountdown()
// end -->
</script>
</span></body></html>


Dite che si riesce a fare qualcosa? Oppure mi tocca rinunciare al counter? :undecided:

Aspetto speranzosa.. :)
Patty
nimeha
Utente Senior
 
Post: 585
Iscritto il: 07/03/03 17:47
Località: Savignano di Romagna ;)

Sponsor
 

Re: Countdown in Javascript, problemi con IE7

Postdi enore.savoia » 23/09/08 01:22

Carissima Patrizia benvenuta

... prova ad inserire il codice (dopo averlo personalizzato ) che ottieni a questo web service (mi raccomando tieni conto dello spazio centrale libero)

http://www.oneplusyou.com/bb/countdown con una soluzione flash si dovrebbe risolvere il problema :)

Ciao
web project manager - consultant freelance
Avatar utente
enore.savoia
Utente Junior
 
Post: 13
Iscritto il: 11/09/08 14:53
Località: Montecatini Terme (Pistoia)

Re: Countdown in Javascript, problemi con IE7

Postdi enore.savoia » 23/09/08 08:40

In alternativa uno script personalizzabile

Codice: Seleziona tutto
<script language="JavaScript1.2">

/*
Dynamic countdown Script- © Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and TOS,
visit http://www.dynamicdrive.com
*/


function setcountdown(theyear,themonth,theday){
yr=theyear;mo=themonth;da=theday
}

//////////CONFIGURE THE COUNTDOWN SCRIPT HERE//////////////////

//STEP 1: Configure the countdown-to date, in the format year, month, day:
setcountdown(2003,12,25)

//STEP 2: Change the two text below to reflect the occasion, and message to display on that occasion, respectively
var occasion="Christmas!"
var message_on_occasion="Merry Christmas!"

//STEP 3: Configure the below 5 variables to set the width, height, background color, and text style of the countdown area
var countdownwidth='480px'
var countdownheight='20px'
var countdownbgcolor='lightblue'
var opentags='<font face="Verdana"><small>'
var closetags='</small></font>'

//////////DO NOT EDIT PASS THIS LINE//////////////////

var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
var crosscount=''

function start_countdown(){
if (document.layers)
document.countdownnsmain.visibility="show"
else if (document.all||document.getElementById)
crosscount=document.getElementById&&!document.all?document.getElementById("countdownie") : countdownie
countdown()
}

if (document.all||document.getElementById)
document.write('<span id="countdownie" style="width:'+countdownwidth+'; background-color:'+countdownbgcolor+'"></span>')

window.onload=start_countdown


function countdown(){
var today=new Date()
var todayy=today.getYear()
if (todayy < 1000)
todayy+=1900
var todaym=today.getMonth()
var todayd=today.getDate()
var todayh=today.getHours()
var todaymin=today.getMinutes()
var todaysec=today.getSeconds()
var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
futurestring=montharray[mo-1]+" "+da+", "+yr
dd=Date.parse(futurestring)-Date.parse(todaystring)
dday=Math.floor(dd/(60*60*1000*24)*1)
dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
//if on day of occasion
if(dday<=0&&dhour<=0&&dmin<=0&&dsec<=1&&todayd==da){
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+message_on_occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+message_on_occasion+closetags
return
}
//if passed day of occasion
else if (dday<=-1){
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+"Occasion already passed! "+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+"Occasion already passed! "+closetags
return
}
//else, if not yet
else{
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+occasion+closetags
}
setTimeout("countdown()",1000)
}
</script>

<ilayer id="countdownnsmain" width=&{countdownwidth}; height=&{countdownheight}; bgColor=&{countdownbgcolor}; visibility=hide><layer id="countdownnssub" width=&{countdownwidth}; height=&{countdownheight}; left=0 top=0></layer></ilayer>


settings :

setcountdown(2003,12,25) Qui imposta il giorno utilizzato per il countdown(AAAA,MM,GG).
var occasion="Christmas!" Questo è il nome dell'evento che accadrà nel giorno da te impostato
var message_on_occasion="Merry Christmas!" Questo è il messaggio che comparirà quel giorno
var countdownwidth='480px' La larghezza del box che conterrà il countdown (regolati sullo spazio centrale del tuo layout)
var countdownheight='20px' L'altezza del box che conterrà il countdown
var countdownbgcolor='lightblue' Il colore del box che conterrà il countdown

dovrebbe essere compatibile con tutti i browsers .. incrocio le dita !
web project manager - consultant freelance
Avatar utente
enore.savoia
Utente Junior
 
Post: 13
Iscritto il: 11/09/08 14:53
Località: Montecatini Terme (Pistoia)

Re: Countdown in Javascript, problemi con IE7

Postdi nimeha » 23/09/08 09:37

enore.savoia ha scritto:... prova ad inserire il codice (dopo averlo personalizzato ) che ottieni a questo web service (mi raccomando tieni conto dello spazio centrale libero)


Ciao, questo servizio lo conoscevo già.. è molto bello, ma purtroppo anche questo è in inglese :( e non c'è modo di trasformarlo in italiano se non nell'ultima parte.. quindi alla fine sarebbe uguale a quello che mi viene offerto dal sito stesso..

In alternativa uno script personalizzabile


Lo script l'ho provato sul mio pc e funziona, ma quando lo incollo nel corpo del layout offertomi da WedShare non me lo vede.. forse questa sintassi non è compatibile col sito?
In pratica il countdown non appare proprio, nè in IE, nè in Firefox..

Grazie comunque! ora provo a vedere se riesco in qualche modo a risolvere..
nimeha
Utente Senior
 
Post: 585
Iscritto il: 07/03/03 17:47
Località: Savignano di Romagna ;)

Re: Countdown in Javascript, problemi con IE7

Postdi nimeha » 23/09/08 09:40

AARRGHHHH!!! :eeh: :eeh: :aaah

Sono una scema... :roll: il problema non era dato dal countdown, bensì dalla foto!!!
ehm.. :oops: diciamo che ieri sera era mooolto tardi..

Ora dovrei aver risolto.. scusatemi!
nimeha
Utente Senior
 
Post: 585
Iscritto il: 07/03/03 17:47
Località: Savignano di Romagna ;)

Re: Countdown in Javascript, problemi con IE7

Postdi enore.savoia » 23/09/08 10:00

:) stavo seguendo l'evoluzione on-line e a IE7 risponde ottimamente ;)

ho apportato modifiche a due blocchi del codice (cosi rimaniamo nella nostra lingua)


Codice: Seleziona tutto
//STEP 2: Change the two text below to reflect the occasion, and message to display on that occasion, respectively
var occasion="nostro Matrimonio!"
var message_on_occasion="Patrizia e Francesco OGGI SPOSI!"


scorri verso il basso e modifica

Codice: Seleziona tutto
//else, if not yet
else{
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+dday+ " Giorni, "+dhour+" ore, "+dmin+" minuti, e "+dsec+" secondi al "+occasion+closetags
}
setTimeout("countdown()",1000)
}
</script>


Ottimo risultato !
web project manager - consultant freelance
Avatar utente
enore.savoia
Utente Junior
 
Post: 13
Iscritto il: 11/09/08 14:53
Località: Montecatini Terme (Pistoia)

Re: Countdown in Javascript, problemi con IE7

Postdi nimeha » 23/09/08 10:05

enore.savoia ha scritto::) stavo seguendo l'evoluzione on-line e a IE7 risponde ottimamente ;)


Hahhaa.. mi spiavi?? ;)
Comunque quelle due modifiche al codice le avevo fatte anch'io.. infatti anche il tuo codice permetteva una traduzione completa.. solo che alla fine sono tornata al primo codice che avevo provato, era quello che alla fine mi piaceva di più..

:arrow: unico problema, quando lo vedo con IE7 mi cancella una riga del bordo.. non so a cosa sia dovuto.. cmq al momento non m'interessa! Non sono poi così perfezionista! :P

Certo che se tu sapessi a cosa è dovuto... non esitare a dirmelo!
nimeha
Utente Senior
 
Post: 585
Iscritto il: 07/03/03 17:47
Località: Savignano di Romagna ;)

Re: Countdown in Javascript, problemi con IE7

Postdi nimeha » 23/09/08 11:03

ultimo update..

ho risolto anche il problema dei bordi in IE7.. :)
Facendo una ricerchina su google ho trovato questo sito, dove viene spiegato il problema.. in pratica alla fine gli ho dovuto aggiungere un "floating left" (che non so manco bene a che serve) che finalmente ha permesso a IE di capire che i bordi erano 4! :P

Beh, direi che è tutto, come sempre grazie del supporto!!
alla prox. Patty
nimeha
Utente Senior
 
Post: 585
Iscritto il: 07/03/03 17:47
Località: Savignano di Romagna ;)

Re: Countdown in Javascript, problemi con IE7

Postdi enore.savoia » 23/09/08 11:14

Non ti si può lasciare n'attimo sola ... apperò mi hai preceduto eehheheh ti stavo proponendo questo (sono un perfezionista) :)

Codice: Seleziona tutto
<body><p><font face="Arial, Helvetica, sans-serif" color="#4e3d2e" size="2">Mancano ancora...</font></p>
<span style="text-align:center; margin:5px 0 5px 0; border:2px solid #000; background-color:#f0f0f0; color:#777; font-size:1.2em;width:20%;display:block;">
web project manager - consultant freelance
Avatar utente
enore.savoia
Utente Junior
 
Post: 13
Iscritto il: 11/09/08 14:53
Località: Montecatini Terme (Pistoia)


Torna a Programmazione


Topic correlati a "Countdown in Javascript, problemi con IE7":


Chi c’è in linea

Visitano il forum: Nessuno e 2 ospiti

cron