lightBox Versione 7 in versione 8


Vai ai contenuti

Menu principale:


Premessa, questo sistema funziona solo con WebSite Evolution versione 8.
E' necessario avere entrambe licenze valide
Evolution 7
Evolution 8

<--------------->

Scaricare e copiare nella cartella files
snakexenzia.js (// Incomedia WebSite X5 2007. All rights reserved.)
snakexenzia.css
load_trans.gif
imzibackg.png
Eccoli in
pacchetto .zip
Questi files andranno possibilmente allegati con la graffetta, per cui verranno automaticamente esportati nella cartella files

Il .js lasciatelo come è
Il .css si puo modificare
Si può tranquillamente cambiare colore sfondo all'immagine ingrandita, si puo fare pure tasparente.
Si puo cambiare la gif di preload.
Si può modificare il testo della descrizione
ecc..
Si possono avere anche più .css modificati, rinominandoli e richiamandoli con le stringhe che vedremo poi.

<---------------------->

Importante.
Aggiungere la stringa di codice

<div id="imZIBackg" style="display: none;" onclick="imZIHide()"></div>

in
Impostazioni Generali
Esperto
Codice per attivazione delle statistiche

<---------------------->


Per richiamare il css e il js, è necessario inserire nelle
Proprietà della pagina
Codice da inserire nell'HEAD fdella pagina

<script type="text/javascript" src="files/snakexenzia.js"></script>

<link rel="stylesheet" type="text/css" href="files/snakexenzia.css" media="screen, print" />

<--------------->
Ora vediamo come inserire le immagini. Si possono inserire in molti modi, addirittura facendo le miniature.png da programma, ma questo lo vediamo un altro giorno. Comunque volete inserirle è possibile usare qualsiasi codice vi venga in mente.
Di seguito porto esempi.
<--------------->

<------------------------>
Primo metodo: miniatura.png immagine in formato jpg

<img style="cursor: pointer;" class="imImagePNG" src="files/immagine.png" width="159" height="159" alt="testo alternativo" title="Title" onclick="imZIZoom('files/immagine.jpg',423,900,'Descrizione immagine ingrandita');" />

testo alternativo

<------------------------>
Secondo metodo: miniatura.png immagine in formato jpg

<a href="javascript:imZIZoom('files/immagine.jpg',423,900,'Descrizione immagine ingrandita');" title=""><img style="border: 0;" class="imImagePNG" src="files/immagine.png" width="159" height="159" alt="testo alternativo" title="Title" /></a>

testo alternativo

<------------------------>
MIniatura in formato jpg invece che png

<a href="javascript:imZIZoom('files/immagine.jpg',423,900,'Descrizione');" title=""><img src="files/miniatura.jpg" alt="" width="200" height="133" border="0" title="" /></a>


Torna ai contenuti | Torna al menu