Consiglio per inserire foto

[MissValerya]

Ciao a tutti, è la prima volta che scrivo nel Forum ma sono iscritta da tanti anni.
Desideravo un vostro gentile aiuto in quanto sono rimasta bloccata a causa della mia scarsa conoscenza in materia.

Con il programma "FrontPage", sto realizzando un semplicissimo sito in HTML puro, con scritte e immagini.
Niente animazioni, niente suoni, niente flash o cose "aggiuntive".

Ora vorrei realizzare una sorta di "slider" manuale di immagini, a scorrimento orizzontale, simile a quello di "Facebook".

Più o meno come lo slider di questo sito: ( http://www.mondosicilia.it/ ), che apparentemente è leggero e privo di plug-in per funzionare.

Il mio scopo FONDAMENTALE è quello di avere un sito leggero e accessibile, che deve poter essere visualizzato anche se si utilizza un vecchio PC del 1973, con 1 KB di RAM.

Adesso a causa della mia scarsa conoscenza, non riesco ad andare avanti.

Cosa mi consigliate?
Ritenete che uno slider come questo, possa essere vincolante ai fini di leggerezza e visualizzazione?

Ho visto che è possibile creare degli slider di immagini utilizzando semplicemente dei codici HTML, ma purtroppo non so nemmeno da dove iniziare.

Vi ringrazio tanto per il vostro aiuto.

Per fare una cosa simile puoi usare jQuery e vai sul sicuro, oppure le nuove regole CSS3 solo che ne risentiranno i browsers più vecchi che non leggeranno le animazioni.

Ti linko questo tutorial

[karl94]

jQuery non è proprio una piuma...
Comunque si potrebbe dare qualche consiglio più mirato sapendo esattamente cosa intendi per vecchio PC, specialmente quali browser (e relative versioni) devono visualizzare correttamente il tutto.

Si, non è una piuma, però usando i CSS3 la maggior parte dei browser vecchi sono tagliati fuori.

[karl94]

Certamente, ma non è neppure necessario scomodare una libreria così grossa per avere solamente una presentazione di immagini. Si può tranquillamente adattare un qualche vecchio script o anche scriverne uno da zero che svolga correttamente il compito.

Si, poi dipende anche dal risultato che vuole ottenere.

beccati questa: http://blog.ndstyle.it/semplice-slideshow-css3/

è semplicissima e leggerissima, devi solo includere un foglio di stile, è ha una bella transizione fading ;)

beccati questa: http://blog.ndstyle.it/semplice-slideshow-css3/

è semplicissima e leggerissima, devi solo includere un foglio di stile, è ha una bella transizione fading ;)

Si ma essendo fatto con i CSS3 funzionerà solo con i browser più recenti.

[MissValerya]

Vi ringrazio tutti per i suggerimenti che mi avete dato.
Confesso che non so nemmeno da dove iniziare per inserire questi codici all'interno del mio HTML, ma a questo ci arriverò in seguito.

Per adesso cerco di trovare la soluzione migliore per far visualizzare le immagini.

Quando ho scritto che "volevo che funzionasse anche sui vecchi PC", intendevo proprio questo.

Voglio essere sicura che la galleria foto (lo slider insomma), venga visualizzato da tutti, a prescindere da browser non aggiornati, PC con pochissima RAM, connessioni lente, etc..etc..

Punto ad un sito LEGGERISSIMO, che non abbia bisogno di plug-in, flash, componenti aggiuntivi, e altre cose per essere visualizzato.

Leggendo su internet, mi sembra di aver capito che se voglio uno slider, vado in contro ai seguenti problemi:
- pesantezza,
- il rischio che molta gente (in base ai loro browser), non visualizzi tutto correttamente.

A questo punto mi vedo costretta a inserire le immagini direttamente "aperte", una per una affiancate.
Come in questo sito --> http://www.vladstudio.com/it/wallpapers/

Sempre evitando che non rallenti durante il caricamento.
Solo così, posso essere certa che il sito venga visualizzato da TUTTI.

Io per esempio, per testare la pesantezza e la corretta visualizzazione dei siti da cui prendo spunto, uso un "Intel Celeron" con 256 MB di RAM, con il browser "Internet Explorer 6" e il sistema operativo "XP Professional".

Alcuni li vedo senza problemi, ma il 90% no.
Appunto perchè richiedono aggiornamenti, e tutto quello che ho elencato sopra.

Capisco che è un problema noioso che vi sto presentando, ma la situazione è questa.

Ringrazio ancora TUTTI per la vostra pazienza.

temo di sì perché le alternative sono jquery.js (x i browser + vecchi) o i css (sito + leggero)...io non ne conosco altre :(

Senza animazioni potresti usare anche solo javascript senza jQuery.

[MissValerya]

Grazie ancora per le risposte.........

AustraliaFever, dove posso trovare qualcosa in merito?

Nel frattempo ho trovato questo: http://flexslider.woothemes.com/#view-html

Ho visto che c'è la possibilità di scegliere tra una struttura "js" o "HTML".
Pensi che rispetti i criteri di leggerezza a cui devo attenermi?

Quando dici "senza animazione", quello che ho trovato io, rientra tra quelli animati, giusto?

Grazie ancora.

Solo HTML non puoi farlo, infatti l'esempio che hai postato te comprende HTML CSS e Javascript con libreria jQuery, che è quella di cui abbiamo parlato sopra.

Io dicevo qualcosa tipo questo, che pur avendo le animazioni, non usa jQuery ed supportato fino a IE7 e addirittura Nescape che è morto, non è supportato però da IE6.

[MissValerya]

Ah bene, praticamente quello che pensavo leggero, è invece da evitare.

Quello che mi hai suggerito tu è ottimo, pure troppo.
Infatti lo vorrei con comandi manuali (un pò come quello di Facebook, dove spuntano le freccette per scorrere), e no automatici...

Se guardi l'esempio 4 è molto simile a quello che cerchi tu, basta mettere in pausa e diventa manuale, oppure volendo si può fare una piccola modifica allo script e renderlo manuale in modo definitivo.

[alemoppo]

Ma due semplici link "successivo" e "precedente" (senza js) per scorrere le immagini? Ha detto che non vuole animazioni e compatibilità con tutto...

Ciao!

[MissValerya]

Grazie ancora per i suggerimenti.........
Confesso che sto andando nel pallone, tra codici, soluzioni possibili e compromessi vari.

Nel frattempo ho trovato 2 slider che funzionano perfino su "Internet Explorer 6":
- http://www.repubblica.it/tecnologia/...8/1/?ref=fad#1

- http://www.baros.com/

Ma non so se funziona con il "CSS", o con le altre cose che avete elencato sopra.

---------------

Solo HTML non puoi farlo...

Siccome avevo trovato una guida che affermava proprio questo, pensavo che si potesse fare...
La guida è questa: http://blog.giallozafferano.it/gzblo...-senza-plugin/

---------------

"alemoppo", potresti farmi vedere un esempio di quello che proponi?

(Prometto che presto vi libererete di me)
Grazie ancora a tutti per il vostro tempo.........

Ma due semplici link "successivo" e "precedente" (senza js) per scorrere le immagini? Ha detto che non vuole animazioni e compatibilità con tutto...

Ciao!

Io consiglio in base alla mie conoscenze, se puoi qualcuno ha proposte più efficaci ben venga, si apprende da tutti.

[MissValerya]

Ma due semplici link "successivo" e "precedente" (senza js) per scorrere le immagini? Ha detto che non vuole animazioni e compatibilità con tutto...

alemoppo, excuse me... qualche esempio da mostrarmi?
Così da farmi qualche idea?

Grazie ancora...

<?php
$maxnumero=10;                            // FISSARE QUI IL NUMERO DI IMMAGINI
$contatore=$_POST['contatore'];
if($contatore=="") $contatore=1;   
$contplus=$contatore+1;
$contminus=$contatore-1;
if($contatore>$maxnumero) $contatore=1;        
if($contplus>$maxnumero) $contplus=1;        
if($contminus==0) $contminus=$maxnumero;
?>

<form name="prev" action="" method="post">
<input type="hidden" name="contatore" value="<? echo $contminus ?>" />  <a href="#" onclick="document.prev.submit();return false;">Immagine precedente</a>
</form>

<img src="/cartellaimmagini/immagine<? echo $contatore ?>.jpg" />
					
<form name="next" action="" method="post">
<input type="hidden" name="contatore" value="<? echo $contplus ?>" />  <a href="#" onclick="document.next.submit();return false;">Immagine successiva</a>
</form>

Script (forse un po' cretino ma funzionante) che uso spessissimo. Due righe di PHP (con un click a Immagine successiva assegno alla variabile $contatore il valore che assume $contplus, cioè un incremento di 1, via POST). Unico parametro da regolare è il numero delle immagini (nell'esempio 10). Basta solo inserire le immagini nella cartellaimmagini e dar loro il nome immagine1.jpg, immagine2.jpg e così via. Credo che la compatibilità sia assicurata. Richiamando con una echo anche le variabili $contminus e $contplus puoi con un minimo di fantasia realizzare anche delle thumbnails per l'immagine precedente e successiva.

[MissValerya]

Ciao coreyx,
grazie anche a te....

Ho copiato i codici in 2 file di testo, giusto per conservarmeli, e la guida che mi hai scritto.
Non ho assolutamente la minima idea di come farli funzionare, ma a questo problema ovvierò in seguito.... sigh......

Non avresti qualche esempio pratico da mostrarmi?
Per vedere come si presenta, come funziona, etc..etc..

Grazie ancora a tuttiiii...........

Guarda, il codice è già pronto... e te l'ho scritto praticamente tutto. Mettiamo ad esempio che la tua pagina si chiami gallery.php e tu abbia una cartella di nome depositoimmagini, nella directory principale del sito, dove inserirai 4 immagini jpg dal nome immagine1.jpg, immagine2.jpg, immagine3.jpg e immagine4.jpg. Allora il codice diventa:

<?php
$maxnumero=4;                            // FISSARE QUI IL NUMERO DI IMMAGINI
$contatore=$_POST['contatore'];
if($contatore=="") $contatore=1;   
$contplus=$contatore+1;
$contminus=$contatore-1;
if($contatore>$maxnumero) $contatore=1;        
if($contplus>$maxnumero) $contplus=1;        
if($contminus==0) $contminus=$maxnumero;
?> 

<html><head></head><body>

<form name="prev" action="" method="post">
<input type="hidden" name="contatore" value="<? echo $contminus ?>" />  <a href="#" onclick="document.prev.submit();return false;">Immagine precedente</a>
</form>

<img src="/depositoimmagini/immagine<? echo $contatore ?>.jpg" />
					
<form name="next" action="" method="post">
<input type="hidden" name="contatore" value="<? echo $contplus ?>" />  <a href="#" onclick="document.next.submit();return false;">Immagine successiva</a>
</form>

</body></html>

In pratica hai semplicemente due link che ti mandano all'immagine successiva o precedente e l'immagine stessa... su come e dove li vuoi posizionare è una scelta tua... ;-)

[MissValerya]

Mmmmmmmm..... si capito.... (ma anche no.....)

Sei stato molto chiaro e preciso, e per questo ti ringrazio, però io sono assolutamente ignorante in materia.
Per me questi codici, sono come il giapponese antico.

Quando ti chiedevo un esempio intendevo un link... perchè al momento, non so come utilizzare questi codici.
Al momento dico.... ma non appena sarò pronta, mi dedicherò anche ai codici....

Per farlo adesso, proverò a creare una cartella sul desktop che chiamerò "depositoimmagini" e dentro gli metto le immagini...
(il resto cerco di capirlo...) scusate ovviamente, ma sono una schiappa.... :D

Un esempio di cosa può venir fuori è QUI.
Niente la pesante libreria JQuery, niente CSS3, solo "HTML puro" (come lo chiami tu) con poche righe di codice PHP (che son quelle scritte sopra su Codice PHP)... magari scritto male (sì, ho usato le tabelle, che son fuori moda, per impaginare... mi sembrava -al tempo- più facile!), ma funzionante praticamente ovunque.

[MissValerya]

Perfetto! Grazie!
Era questo l'esempio che chiedevo.

Non si presenta male e soprattutto è leggera come galleria.
Il tempo di capire come inserirla nel mio futuro sito, e poi siamo a posto.

[MissValerya]

Ho trovato anche questi slider...
magari a qualcuno interessano...
----> http://www.woothemes.com/products/wooslider/