slideshow con avanzamento manuale

[vecio88]

la parte in javascript sicuramente pero calcola che con JQuery riduci di molto il codice da scrivere...Io lo sto studiando ora perciò ti suggerisco di darci un occhiata o magari attendere il parere di uno più esperto di me

[Grambo]

ma non puoi mettere un onclick sull'immagine che mandi all'immagine successiva? O.o

PS dov'è lo slideshow sul tuo sito ?

PPS ok trovato.. non avevo notato il menù XD

[jurij7]

come posso utilizzare nello slideshow ?

[Grambo]

non so come "ragiona" il tuo slideshow XD
comunque l'onclick lo metti sull'immagine così che quando la clicchi vai all'immagine successiva...lo slideshow sarà un evento assegnato al body quindi continuerà a funzionare semplicemente ripartendo dall'immagine successiva

in pratica non c'entra nulla la funzione di slide

[jurij7]

ciao, questa è la parte dello slideshow presente nella mia pagina

<div id="mainContent">
   <div align="center">
     <div id="slideshow">
       <div align="center">
       		
            [img]BW Sito/People/megavapalanladi.jpg[/img]
           
            [img]BW Sito/People/PrimaCheVengaNeve.jpg[/img]           
            [img]BW Sito/People/HowToDisappearCompletely.jpg[/img]
            [img]BW Sito/People/Senza-titolo-23.jpg[/img]
            [img]BW Sito/People/HoVistoManiCheNonSannoSfior.jpg[/img]
            [img]BW Sito/People/LumeLume.jpg[/img]
            [img]BW Sito/People/LaMismaLuna.jpg[/img]
       </div>
   </div>
 </div>
</div>

in questo modo le immagini scorrono regolarmente ed io vorrei aggiungere anche la funzione che cliccando su ogni singola immagine passa alla successiva.
Sicuramente come sto utilizzando onClick non è giusto, mi dite come fare?
grazie

[cavicchiandrea]

Per modificare quello script ci vole tempo, pazienza, e voglia poi non è detto che risultato finale sia quello desiderato.
Vista la tua poco dimestichezza con js cerca qui qualcosa che faccia più al caso tuo, se questo consiglio non ti piace come non detto e attendi che qualcuno ti scriva le modifiche

[Enzaccio]

Visto che si tratta del sito di un fotografo, ti dico un' altra faccenda ...

Nella pagina interviene anche questo foglio di style esterno richiamato dal Tag:
<link rel="stylesheet" href='slideshow.css' type="text/css" />

#slideshow {
	display:block;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	overflow: hidden;
	height: 500px;
	width: auto;
}

#slideshow img {
	width: auto;
	height: 500px;
	position: relative;
	margin-right: auto;
	margin-left: auto;
	display: block;
}

Il selettore #slideshow img compie un resize dell' immagine, ma è un ridimensionamento affidato al browser, che non è propriamente un programma di image editing; fa quello che può, e i risultati non sono dei migliori, per l' intento fotografico.
Dovresti già caricare le immagini alla dimensione nativa in altezza di .. 500 o (?) 550 pixel (devo ancora studire il codice, come mai la pagina le sputa fuori da 550 height).
In parole povere, te ne fai sul tuo computer dei duplicati in formato ridotto, IrfanView va già più che bene, e poi le carichi sul server.

Nota già la prima immagine, la ferrovia, come appaiono scalettati i binari.
Esco.jpg ad esempio, è caricata come immgine addirittura da 5669 x 4011 px per quasi 1 Megabyte di peso; questo comporta anche un tempo di attesa più lungo prima che le immagini procedano a sfogliare, per il visitatore che compare sul tu sito per la prima volta.
Tu questo non lo noti più, perchè il browser ha già memorizzato in cache le immagini dal primo dawnload.

P.S.:

come mai la pagina le sputa fuori da 550 height

ah ecco, c'è anche questo questo file css http://www.nicolacolonna.com/slideshow2.css che viene fatto entrare in gioco via JavaScript dal setAttribute e "vince" sullo slideshow.css

#slideshow {
	margin-left:auto;
	margin-right:auto;
	position:relative;
	height: 550px;
	width: auto;
}

#slideshow img {
	position: relative;
	top: 0px;
	left: 0px;
	display: none;
	overflow: visible;
	right: 0px;
	bottom: 0px;
	height: 550px;
	width: auto;

[jurij7]

quindi tu dici che per evitare il resize devo ridimensionare le foto tutte ad altezza pari a 500px per uniformarmi alla dimensione che ho dato allo slideshow, giusto?

[jurij7]

ciao ti ringrazio molto così finalmente ho risolto il problema del resize della foto iniziale.
mi consigli di modificare le dimensioni di tutte le foto portandole ad una altazza pari a quella presente in entrambi gli slideshow.css ?
per fare avvenire un caricamento dello slideshow abbastanza veloce, e salvando con il plugin per il web, che dimensione massima dovrebbe avere una foto?
grazie

[jurij7]

ok sistemato.
volevo chiederti : come posso fare per inserire i titoli ad ogni foto della slideshow?