PDA

Visualizza la versione completa : galleria fotografica e "cambio immagine"


Fortebraccio
21-03-2003, 10:54
Dovrei creare una galleria di foto e ho un menu con molte voci ciascuna delle quali corrisponde ad una immagine:
A) creo ,usando come modello la pagina del menu, una pagina per ogni foto (quindi se ho 50 foto devo creare 50 pagine html tutte uguali e tutte con lo stesso men ed ognuna corrispondente ad una voce del menu)
B) esiste un modo pi semplice? per esempio costringere il browser ad una sorta di cambio immagine nella stessa pagina quando si clicca sulle varie voci del menu??
Uso Dreamweaver

hako
21-03-2003, 12:37
ho trovato questo, un po ostico da spiegare.
Smanettaci un po e vedrai che otterrai ottimi risultati.
(cliccando sulla miniatura della foto visualizzerai la stessa sulla stessa pagina, quindi non 50 pagine! ma 50 miniature sulla stessa pagina)

<html>

<head>

<title></title>

<SCRIPT language=JavaScript>
<!--
version = "0";
browserName = navigator.appName;

browserVer = parseInt(navigator.appVersion);
if ((browserName == "Netscape" && browserVer >=3) || ((browserName.indexOf( "Microsoft") >= 0) && browserVer >= 4 )) version ="n3";
else version = "n2"

function set_pic(imgName) {
if (version == "n3") {
imgOn = ("" + imgName + ".jpg");
document.mainpic.src = imgOn;
}
}
//-->
</SCRIPT>


</head>

<body link="#999999" vlink="#999999" alink="#999999" bgcolor="#666666">

<div align="center">
<center>


</p>
</div>
<table border="0" width="100%" height="450" cellspacing="0" cellpadding="0">
<tr>
<td width="85" height="24" valign="top" background="images/bkg1.gif" bgcolor="#333333">
<a href="javascript:onClick=set_pic('foto/ts01');">
foto/ts01A.jpg</a>foto/ts02A.jpg (javascript:onClick=set_pic('foto/ts02');)</td>
<td width="100%" valign="middle" align="center" style="font-size: 12 px; font-family: Arial, Helvetica, Verdana">
<table cellSpacing="0" cellPadding="0" width="500" border="0" background="images/backline1.gif">
<tbody>
<tr>
<td height="20"></td>
</tr>
<tr>
<td width="500" valign="middle" align="center">
<p align="center">
foto/ts01.jpg</p>
</td>
</tr>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td width="78" height="24" valign="top" background="images/bkg1.gif" bgcolor="#333333"></td>
</tr>
</table>
</body>

</html>

herrel
21-03-2003, 12:41
questa una soluzione semplice che dovresti integrare facilmente....
invece che cinquanta pagine puoi farne 5 da 10 l'una.
Per correttezza devo dirti che nn l'ho scritto io!!!
ma molto facile da comprendere...pure troppo!!!! :gren:

codice:

<html>
<head>
<title>Untitled</title>
</head>

<body>
<script language="javascript">
function Immagine_01() {
immagine2.style.display = "None";
immagine3.style.display = "None";
immagine4.style.display = "None";
immagine1.style.display = "";
}
function Immagine_02() {
immagine1.style.display = "None";
immagine3.style.display = "None";
immagine4.style.display = "None";
immagine2.style.display = "";
}
function Immagine_03() {
immagine1.style.display = "None";
immagine2.style.display = "None";
immagine4.style.display = "None";
immagine3.style.display = "";
}
function Immagine_04() {
immagine1.style.display = "None";
immagine2.style.display = "None";
immagine3.style.display = "None";
immagine4.style.display = "";
}

</script>



<table align="center" width="600" border="1">
<tr>
<td width="120"><center>
<table>
<tr><td align="center">foto 1 (#)</td></tr>
<tr><td align="center">foto 2 (#)</td></tr>
<tr><td align="center">foto 3 (#)</td></tr>
<tr><td align="center">foto 4 (#)</td></tr>
</tr></table></center></td>

<td width="480" height="250" align="center">
immagine1.jpg
immagine2.jpg
immagine3.jpg
immagine4.jpg
</td>
</tr>

</table>






</body>
</html>





:ciauz:

hako
21-03-2003, 14:21
Quella di Herrel, un'ottima soluzione.
ma (se non erro) c' una sostanziale differenza.
Nel primo script le immagini vengono caricate solo se richieste dall'utente.
Nello script di Herrel tutte le immagini vengono caricate al caricamento della pagina.
Il che significa che con immagini da 30kb avremo un peso minimo
di 300kb!
Corregetemi se sbaglio:bh:

Fortebraccio
21-03-2003, 17:06
grazie, siete stati molto gentili, ora mi studio un p gli scripts

herrel
21-03-2003, 17:22
Originariamente inviato da hako
Quella di Herrel, un'ottima soluzione.
ma (se non erro) c' una sostanziale differenza.
Nel primo script le immagini vengono caricate solo se richieste dall'utente.
Nello script di Herrel tutte le immagini vengono caricate al caricamento della pagina.
Il che significa che con immagini da 30kb avremo un peso minimo
di 300kb!
Corregetemi se sbaglio:bh:


si infatti per questo consigliavo pi pagine.....
questo script nasceva per la visualizzazione di solo 3 immagini!!

il bello del forum proprio questo....io per esempio trovo il tuo script ottimo!!!!!:gren: :gren:

lo cambio un po' e quasi quasi lo riciclo!!!!!:gren:

RobMcSword
21-03-2003, 23:28
hai parlato di men.

hai le foto divise per argomenti oppure nel men ci sono i richiami alle foto? (es: io al mare -> foto, nella roulotte ->foto)

Fortebraccio
22-03-2003, 18:29
Originariamente inviato da RobMcSword
hai parlato di men.

hai le foto divise per argomenti oppure nel men ci sono i richiami alle foto? (es: io al mare -> foto, nella roulotte ->foto)

nel menu ci sono i richiami per le foto: ad ogni voce corrisponde una foto; immagina di dover fare un visore immagini per il sito di una galleria di arte

RobMcSword
23-03-2003, 01:23
non ti piacerebbe fare una pagina con tutte le anteprime (formato minuscolo, diciamo max 100px il lato pi lungo) e, cliccandoci sopra, farla vedere per intero in una popup?
(questo solo in'idea)

Fortebraccio
23-03-2003, 09:27
pu essere un'idea, tieni presente che sono pi web grafico che web programmatore e finora il javascript me lo hanno sempre fatto automaticamente Fireworks e Dreamweaver. Comunque, dalle prove fatte , le cose vanno bene solo se le foto sono tutte assolutamente uguali come dimensioni e con l'identico orientamento (tutte orizzontali o tutte verticali.

Loading