[RISOLTO]Inserimento Slide Html

maurizio

Utente Attivo
19 Nov 2012
70
0
0
Ciao a tutti

Mi servirebbe un consiglio per l'inserimento di una slide che visualizzi 3/4 immagini nel tempo che stabilirò io.
Inoltre non vorrei usare cms o richiami verso altre pagine. è possibilie fare una cosa del genere?scrivere direttamente il codice in HTML o in CSS o in JAVASCRIPt.

Cosa mi consigliate di fare?

Grazie in anticipo per la risposta.

Maurizio
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao,
potresti fare in questo modo
HTML:
<!DOCTYPE html>
<html>
    <head>
        <title>Slide</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
            window.onload = function(){
                
                var immagini = new Array();
                immagini[0] = "DOC.png";
                immagini[1] = "JS.png";
                immagini[2] = "PSD.png";
                immagini[3] = "ASP.png";
                
                var immagine = document.getElementById("slide");
                var tempo = 3000; // tempo per il cambio immagine
                var i = 0; // incrementatore
                var dir = "img/icon_file/"; // percorso della cartlla immagini
                
                setInterval(function(){
                    
                    immagine.src = dir + immagini[i];
                    i++;
                    if(i == immagini.length - 1 ) i = 0;
                    
                },tempo);
                
            }
        </script> 
    </head>
    <body>
        <img id="slide" src="img/icon_file/ASP.png" alt="img"/>
    </body>
</html>
in pratica la funzione cambia l'immagine ogni tot di tempo
una cosa piuttosto semplice e senza nessun richiamo a librerie esterne
 
Ultima modifica:

eidos

Nuovo Utente
13 Giu 2013
1
0
0
inserimento link <a href=

Perfetto questo script, proprio quello che cercavo!
Ma si potrebbe inserire anche un <a href= alle immagini?
grazie
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, pui modificare cosi
HTML:
<!DOCTYPE html>
<html>
    <head>
        <title>Slide</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
            window.onload = function(){
                
                var immagini = new Array();
                immagini[0] = "DOC.png";
                immagini[1] = "JS.png";
                immagini[2] = "PSD.png";
                immagini[3] = "ASP.png";
                
                var links = new Array();
                links[0] = "http://www.w3schools.com/";
                links[1] = "http://www.php.net";
                links[2] = "https://www.mrw.it";
                links[3] = "http://www.google.it";
                
                var immagine = document.getElementById("slide");
                var link = document.getElementById("link");
                
                var tempo = 3000; // tempo per il cambio immagine
                var i = 0; // incrementatore
                var dir = "img/"; // percorso della cartlla immagini
                
                setInterval(function(){
                    
                    immagine.src = dir + immagini[i];
                    link.href = links[i];
                    i++;
                    if(i == immagini.length) i = 0; // tolto il -1
                    
                },tempo);
                
            }
        </script> 
    </head>
    <body>
        <a id="link" href="http://www.google.it"><img id="slide" src="img/ASP.png" alt="img"/></a>
    </body>
</html>
ho fatto una modifica nel codice perche prima non visualizzava mai l'ultima immagine
 

bibbul_dex

Nuovo Utente
22 Ago 2014
4
0
0
Salve, scusate se riapro questa discussione, era per non aprirne una nuova visto che già c'è ne una ma se è necessario ne apro un'altra, comunque passando al dunque vi volevo chiedere come applicare un effetto di animazione a questo slider... un effetto fade o slide o qualche altro effetto... Grazie e buonanotte :)
 

machopicho

Nuovo Utente
31 Ago 2016
1
0
1
Ciao,
potresti fare in questo modo
HTML:
<!DOCTYPE html>
<html>
    <head>
        <title>Slide</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
            window.onload = function(){
             
                var immagini = new Array();
                immagini[0] = "DOC.png";
                immagini[1] = "JS.png";
                immagini[2] = "PSD.png";
                immagini[3] = "ASP.png";
             
                var immagine = document.getElementById("slide");
                var tempo = 3000; // tempo per il cambio immagine
                var i = 0; // incrementatore
                var dir = "img/icon_file/"; // percorso della cartlla immagini
             
                setInterval(function(){
                 
                    immagine.src = dir + immagini[i];
                    i++;
                    if(i == immagini.length - 1 ) i = 0;
                 
                },tempo);
             
            }
        </script>
    </head>
    <body>
        <img id="slide" src="img/icon_file/ASP.png" alt="img"/>
    </body>
</html>
in pratica la funzione cambia l'immagine ogni tot di tempo
una cosa piuttosto semplice e senza nessun richiamo a librerie esterne
Salve,
ho la necessità di creare un file html dove poter far girare le immagini su pc locale...
E' possibile utilizzare questo codice?
Grazie per l'attrenzione

Saluti
 
Discussioni simili
Autore Titolo Forum Risposte Data
C [RISOLTO]Inserimento variabile php in input html PHP 20
A [RISOLTO]Inserimento Immagini da pc a MySql PHP 15
M [risolto] Inserimento link in tabella da database PHP 3
H [RISOLTO]Inserimento file xml Ajax 3
A [RISOLTO]Inserimento nel database MySQL 13
A [RISOLTO] Inserimento nel database MySQL 5
pup3770 [RISOLTO]Pagina di inserimento con visualizzazione temporizzata PHP 7
M [RISOLTO] inserimento dati db PHP 22
O [risolto] Inserimento nuovo campo in mysql. Problema PHP 6
Jonn Inserimento [RISOLTO] sui tread Supporto Mr.Webmaster 1
L (risolto) MySQL 0
B getElementById su piu id(Risolto) Javascript 6
L Esercitarsi con Js [RISOLTO] Javascript 4
L risolto visualizzazione e ordinamento dati PHP 1
moustache [RISOLTO] SQL PHP IIS PHP 8
Sergio Unia Ricezione email con destinatari multipli [Risolto] PHP 2
L update tabelle in php mysql [risolto] PHP 6
M Semplice visualizzatore di immagini [risolto con plugin wp] PHP 7
L [RISOLTO] Stampa a video risultato count in html PHP 13
L [RISOLTO] Eliminare una discussione creata PHP 3
tomorc [HTML] Problema con scroll bar (risolto) HTML e CSS 0
A [PHP] Problema query insert [RISOLTO] PHP 14
B [PHP] recuperare IP dei server in load balancing [RISOLTO] PHP 3
K [RISOLTO] Problema Griglia Php+Mysql PHP 13
S [RISOLTO] aggiorna tabella da select option asp classic Classic ASP 7
elpirata [RISOLTO][Javascript] Datapicker e autocompletamento campo input Javascript 2
elpirata [RISOLTO][Mysql] Problema insert valori apostrofati MySQL 1
elpirata [RISOLTO][Mysql] Contare le occorrenze in un campo tipo varchar MySQL 2
G [MS Access] Gestione biglietti [RISOLTO] MS Access 2
G [MS Access] Casella combinata & Query [RISOLTO] MS Access 4
G [MS Access] Query mese corrente con conteggio [RISOLTO] MS Access 2
M [RISOLTO]Windows media player non mi funziona più su win 10 pro 64 bit Windows e Software 2
C [RISOLTO][PHP] Errore di sintassi PHP 8
IT9-Gpp [RISOLTO] Leggere variabile restituita da success Ajax 3
Kolop [RISOLTO][PHP] Problema Pagination PHP 2
C [RISOLTO][PHP] Funzione ONclick PHP 14
C [RISOLTO][PHP] Conteggio righe di una tabella PHP 4
N [PHP] Utilizzo variabili di sessione [Risolto] PHP 13
Tommy03 [RISOLTO][PHP] Webserver o devserver? PHP 2
Sergio Unia Recupero dati da una vecchia versione MySql [Risolto] MySQL 4
spider81man [PHP] Problemi cancellazione dato su DB [RISOLTO] PHP 1
A [PHP] RISOLTO Invio Mail con Tabella PHP 2
felino Risolto - [Wordpress][WooCommerce] PayPal Checkout e campi di fatturazione WordPress 2
elpirata [PHP][RISOLTO] Sommare gli importi estratti da un ciclo while PHP 3
elpirata [PHP][RISOLTO] Effettuare la somma dei tempi di lavorazione PHP 3
elpirata [PHP] [RISOLTO]Sovrascrivere testo in una tabella PHP 2
A [RISOLTO]Recuperare dati inviati con json tramite php PHP 4
C [RISOLTO][PHP] Passaggio variabili senza refresh di pagina PHP 7
elpirata [PHP][RISOLTO] Errore di tipo Notice: Undefined index - Come risolvere quando si hanno tante var PHP 10
S Problema in PHP per invio file XML - RISOLTO- PHP 8

Discussioni simili