// JavaScript Document /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* AUMENTARE E DIMINUIRE L'ALPHA DEL MENU DI NAVIGAZIONE */ /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ var menu_nav_prod=document.getElementById("bck_menu"); var opac=32; var id_darken=0; var id_light=0; /* funzione schiarimento colonna menu navigazione prodotti */ /* ------------------------------------------------------------------------- */ function lighter() { if(opac >= 32) { opac-=1; menu_nav_prod.style.filter="alpha(opacity="+opac+")"; menu_nav_prod.style.mozopacity=opac/100; menu_nav_prod.style.opacity=opac/100; }else{ clearInterval(id_light); } } /* ------------------------------------------------------------------------- */ /* funzione pre - schiarimento colonna menu navigazione prodotti */ /* ------------------------------------------------------------------------- */ function pre_light() { clearInterval(id_darken); id_light=window.setInterval('lighter()',5); } /* ------------------------------------------------------------------------- */ /* funzione scurimento colonna menu navigazione prodotti */ /* ------------------------------------------------------------------------- */ function darken() { if(opac <= 75) { opac+=1; menu_nav_prod.style.filter="alpha(opacity="+opac+")"; menu_nav_prod.style.mozopacity=opac/100; menu_nav_prod.style.opacity=opac/100; }else{ clearInterval(id_darken); } } /* ------------------------------------------------------------------------- */ /* funzione pre scurimento colonna menu navigazione prodotti */ /* ------------------------------------------------------------------------- */ function pre_darken() { clearInterval(id_light); id_darken=window.setInterval('darken()',5); } /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* VISUALIZZARE E NASCONDERE LE VARIANTI DI COLORE DEL PRODOTTO */ /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* variabile path immagine */ var path_image=""; /* variabile elemento contentitore dell'immagine */ var el_variant=""; /* funzione visualizzazione variante di colore del prodotto */ function view_variant(path_image) { /* selezione dell'immagine nascosta */ el_variant=document.getElementById("prod_image_off"); /* se el_variant è nullo allora esiste già una variante visualizzata */ if(el_variant==null) { el_variant=document.getElementById("prod_image"); } el_variant.id="prod_image"; /* seleziono il contenitore per l'immagine */ var imm=document.images["imm_prod"]; /* carico l'immagine */ imm.src="phpthumb/phpThumb.php?src=../"+path_image+"&h=270&q=100&fltr[]=wmi|images/zoom.png|TR"; /* link immagine per lightbox */ var light_b=document.getElementById("light_b"); light_b.href=path_image; } /* funzione per nascondere la variante di colore visualizzata */ function hide_variant() { /* cambio id dell'immagine e quindi le sue regole css*/ var el_variant=document.getElementById("prod_image"); el_variant.id="prod_image_off"; } /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* RISOLVERE PROBLEMA VISUALIZZAZIONE TRASPARENZA DIV DEL BROWSER OPERA */ /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* script per risolvere il problema della trasparenza via css non supportata dal browser Opera */ if(navigator.userAgent.indexOf("Opera") > -1 && navigator.userAgent.indexOf("8")> -1) { var m=document.getElementById("bck_menu"); m.style.backgroundColor="transparent"; m.style.backgroundImage="url(images/content/products/bck_menu_pr_opera.png)"; } /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* ANIMAZIONE SCROLLER VARIANTI DI COLORE */ /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* variabile identificatore del menu varianti di colore */ var col=""; /* variabile posizione finale calcolata sull'evento up o down */ var new_postion=0; /* variabile memorizzazione incremento o decremento delle varianti di colore */ var decr=0; /* variabile identificatore setinterval scroll down varianti di colore */ var id_down=0; /* variabile identificatore setinterval scroll up varianti di colore */ var id_up=0; /* variabile altezza max scroll in base al numero di varianti di colore */ var row_prod=0; /* controllo che il numero di varianti di colore sia superiore a tre per attivare il multiriga */ /* ------------------------------------------------------------------------------------------- */ if(num_prod >3) { /* visualizzo scroll verso il basso dato che ho più di tre varianti di colore */ var down=document.getElementById("div_down_prod"); down.style.visibility="visible"; /* calcolo altezza massima in base al numero di varianti di colore */ if(Math.floor(num_prod % 3)==0) { row_prod=Math.floor(num_prod / 3)-1; }else{ row_prod=Math.floor(num_prod / 3); } row_prod=((row_prod+1)* -100)+100; } /* ------------------------------------------------------------------------------------------ */ /* funzione incremento posizione varianti di colore verso l'alto */ /* ------------------------------------------------------------- */ function upper(pos) { /* pos è il valore della posizione finale */ if(decr!=pos){ decr-=4; col.style.top=decr+"px"; }else{ clearInterval(id_down); id_down=0; id_up=0; } } /* ------------------------------------------------------------- */ /* funzione decremento posizione varianti di colore verso il basso */ /* --------------------------------------------------------------- */ function downer(pos) { /* pos è il valore della posizione finale */ if(decr!=pos){ decr+=4; col.style.top=decr+"px"; }else{ clearInterval(id_up); id_up=0; id_down=0; } } /* --------------------------------------------------------------- */ /* controllo del click per decremento verso il basso delle varianti di colore */ /* -------------------------------------------------------------------------- */ function down_prod_col() { /* si attiva solo se entrambi i setinterval sono disattivati */ if(id_up==0 && id_down==0) { /* seleziono l'oggetto lista che contiene le varianti di colore */ col=document.getElementById("colors"); /* memorizzo la posizione corrente */ var position=col.style.top; /* converto il valore di stringa derivato dal css in valore numerico */ if(position!=""){position=parseFloat(position)} /* calcolo la nuova posizione sottraendo il passo di 100px alla pos corrente */ new_position=position-100; /* se la pos finale è minore della massima altezza allora sono all'ultima variante e non posso andare oltre */ if(new_position<=row_prod) { /* non posso più scendere */ var down=document.getElementById("div_down_prod"); down.style.visibility="hidden"; /* posso solo tornare su */ var up=document.getElementById("div_up_prod"); up.style.visibility="visible"; }else{ /* se non sono ancora arrivato in fondo posso ancora scendere o salire */ var down=document.getElementById("div_down_prod"); down.style.visibility="visible"; var up=document.getElementById("div_up_prod"); up.style.visibility="visible"; } /* imposto la variabile di decremento */ decr=100+new_position; /* faccio partire l'animazione */ id_down=setInterval('upper(new_position,col)',10); } } /* -------------------------------------------------------------------------- */ /* controllo del click per incremento verso l' alto delle varianti di colore */ /* -------------------------------------------------------------------------- */ function up_prod_col() { /* si attiva solo se entrambi i setinterval sono disattivati */ if(id_up==0 && id_down==0) { /* ricavo la posizione delle varianti di colore */ col=document.getElementById("colors"); var position=col.style.top; /* trasformo il valore di stringa in numero */ if(position!="") { position=parseFloat(position) } /* definisco la nuova posizione finale del menu con passo fisso di 100px */ new_position=position+100; /* se la posizione di arrivo è =0 non visualizzo la freccia UP mi trovo in cima alla lista */ if(new_position==0) { /* non posso scrollare in alto */ var up=document.getElementById("div_up_prod"); up.style.visibility="hidden"; /* posso solo muovermi verso il basso */ var down=document.getElementById("div_down_prod"); down.style.visibility="visible"; }else{ /* posso muovermi sia in alto che in bassp */ var up=document.getElementById("div_up_prod"); up.style.visibility="visible"; var down=document.getElementById("div_down_prod"); down.style.visibility="visible"; } /* setinterval per spostare il menu */ id_up=setInterval('downer(new_position)',10); } } /* -------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* CHIUSURA E APERTURA DEL TESTO DESCRIZIONE DEL PRODOTTO */ /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* passo di espansione del testo */ var expansion=0; /* variabile oggetto testo aperto o chiuso */ var descr=""; /* variabile oggetto tabella */ var table=""; /* identificatore interval */ var id_expand=0; /* identificatore interval */ var id_contract=0; /* funzione espansione del testo */ /* --------------------------------------------------------------------------------------------------- */ function expand() { /* altezza massima del testo */ if(expansion<=200) { /* passo di espansione +2px */ expansion+=4; /* aumento altezza del testo + offset del testo chiuso */ descr.style.height=75+expansion+"px"; /* sposto la tabella dei dettagli */ table.style.top=expansion+"px"; }else{ /* terminata espansione testo */ /* nascondo il testo che era chiuso */ descr=document.getElementById("descr_text_close"); descr.style.visibility="hidden"; /* aumento colore del testo fino al bianco */ descr=document.getElementById("descr_text_open"); descr.style.color="#fff"; /* rendo visibile l'etichetta close */ descr=document.getElementById("close"); descr.style.visibility="visible"; clearInterval(id_expand); id_expand=0; } } /* funzione pre - espansione del testo */ /* --------------------------------------------------------------------------------------------------- */ function text_expand() { /* nascondo etichetta expand */ descr=document.getElementById("expand"); descr.style.visibility="hidden"; /* seleziono la tabella dei dettagli */ table=document.getElementById("cont_table"); /* seleziono il testo chiuso */ descr=document.getElementById("descr_text_close"); /* aumento intensità del colore carattere fino al bianco */ descr.style.color="#fff"; /* seleziono testo da aprire e imposto il colore del carattere ad un livello di grigio + rendo visibile */ descr=document.getElementById("descr_text_open"); descr.style.visibility="visible"; descr.style.color="#888"; /* richiamo funzione per espandere il testo aperto e far scomparire il testo chiuso */ id_expand=setInterval('expand()',10); } /* funzione chiusura del testo */ /* --------------------------------------------------------------------------------------------------- */ function contract() { if(expansion>0) { /* passo di chiusura -2px*/ expansion-=4; /* chiudo il testo */ descr.style.height=expansion+"px"; /* sposto la tabella verso l'alto */ table.style.top=expansion+"px"; }else{ altezza=0; /* nascondo il testo aperto */ descr=document.getElementById("descr_text_open"); descr.style.visibility="hidden"; /* aumento il colore fino al bianco del testo chiuso*/ descr=document.getElementById("descr_text_close"); descr.style.color="#fff"; /* ripristino l'etichetta expand */ descr=document.getElementById("expand"); descr.style.visibility="visible"; clearInterval(id_contract); id_contract=0; } } /* funzione pre - chiusura del testo */ /* --------------------------------------------------------------------------------------------------- */ function text_close() { /* rendo invisibile l'etichetta close */ descr=document.getElementById("close"); descr.style.visibility="hidden"; /* seleziono testo chiuso e lo rendo visibile */ descr=document.getElementById("descr_text_close"); descr.style.visibility="visible"; /* seleziono testo aperto */ descr=document.getElementById("descr_text_open"); /* solo se l'animazione di espansione è finita chiudo il testo */ if(id_expand==0) { id_contract=setInterval('contract()',10); } } /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* SCROLLING DELLA TABELLA DETTAGLI DEL PRODOTTO */ /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* variabile di posizione */ var change_pos=0; /* variabile id movimento verso l'alto della tabella */ var id_move_down=0; /* controllo che la tabella abbia bisogno effettivamente dello scrolling */ var table_details=document.getElementById("details"); /* controllo se il prodotto appartiene alla categoria tuning */ if(tuning==0 || tuning==2) { var div_cont_table=document.getElementById("cont_details"); } else { /* spazio per la descrizione dei dettaggli maggiore rispetto alle altre categorie */ var div_cont_table=document.getElementById("cont_details_tuning"); } /* differenza tra l'altezza della tabella dei dettagli ed il suo contenitore */ if(tuning==1 || tuning==2) { var diff=(table_details.offsetHeight*-1)+div_cont_table.offsetHeight-18; } else { var diff=(table_details.offsetHeight*-1)+div_cont_table.offsetHeight+10; } /* se l'altezza della tabella è maggiore del div che la contiene */ if(diff<=0) { /* ...allora visualizzo le freccie di scrolling */ var details_arrow=document.getElementById("down_details"); details_arrow.style.visibility="visible"; details_arrow=document.getElementById("up_details"); details_arrow.style.visibility="visible"; } /* ------------------------------------------------------------------------------------------------------------------- */ /* MOVIMENTO VERSO IL BASSO DELLA TABELLA */ /* ------------------------------------------------------------------------------------------------------------------- */ /* funzione per fermare il movimento verso il basso della tabella */ /* --------------------------------------------------------------------------------------------- */ function stop_up(){ clearInterval(id_move_up); } /* funzione di movimento della tabella verso il basso */ /* --------------------------------------------------------------------------------------------- */ function move_up(){ /* se la tabella arriva nella sua posizione di start */ if(change_pos<0) { var table_det=document.getElementById("details"); change_pos+=1; /* moviemtno della tabella verso il basso - passo di 1 px*/ table_det.style.top=change_pos+"px"; }else{ stop_up(); } } /* funzione di pre - movimento della tabella verso il basso */ /* --------------------------------------------------------------------------------------------- */ function details_up(){ id_move_up=window.setInterval('move_up()',5) } /* ------------------------------------------------------------------------------------------------------------------- */ /* MOVIMENTO VERSO L'ALTO DELLA TABELLA */ /* ------------------------------------------------------------------------------------------------------------------- */ /* funzione per fermare il movimento verso l'alto della tabella */ /* --------------------------------------------------------------------------------------------- */ function stop_down(){ clearInterval(id_move_down); } /* funzione di movimento della tabella verso l'alto */ /* --------------------------------------------------------------------------------------------- */ function move_down(){ /* variabile oggetto tabella */ var table_det=document.getElementById("details"); if(change_pos>diff) { change_pos-=1; /* spsoto la tabella verso l'alto con passo 1px */ table_det.style.top=change_pos+"px"; } } /* funzione di pre - movimento della tabella verso l'alto */ /* --------------------------------------------------------------------------------------------- */ function details_down(){ id_move_down=window.setInterval('move_down()',5) } /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* GESTIONE ROLLOVER BORDI DELLE IMMAGINI PER EXPLORER 6 E PRECEDENTI */ /* --------------------------------------------------------------------------------------------------------------------------------------------------- */ /* variabile che contiene informazioni varie sul browser.... incluso numero della versione */ var browser_info=navigator.appVersion; /* cerco browser internet explorer 6.0 */ var browser_info_ms_6=browser_info.search("MSIE 6.0"); /* cerco browser internet explorer 5.55 */ var browser_info_ms_5=browser_info.search("MSIE 5.5"); /* se il browser è internet explorer 6.0 o 5.55 allora gestisco i bordi delle preview attraverso javascript */ if(browser_info_ms_6!= -1 || browser_info_ms_5!= -1) { /* seleziono l'elenco delle varianti di colore */ /* ------------------------------------------------------------------------------------------------------------------------------ */ var menu=document.getElementById("colors"); /* seleziono tutti gli elementi LI */ for(i=0;i