SLIDESHOW COME SFONDO PAGINA
Autor: SIMONE C.
Visitado 3936,
Seguidores 3,
Compartilhado 0
Salve, vorrei sapere come fare per inserire uno slideshow ( anche quello di website x5) come sfondo della pagina ...Grazie
Publicado em
... il metodo migliore che ho visto, (dopo quello inventato da me), è quello proposto da Mirko ... che trovi qui: http://answers.websitex5.com/post/52845 ...eventualmente contattalo tramite il suo profilo; ...si è sempre dimostrato disponibile...
... per usare il metodo del programma, occorrerebbero degli escamotages, e che non avendo il programma non posso proporti; ...ma segui la prima indicazione e risolverai alla grande...
.
ciao
Autor
Ciao, grazie, ma ho visto il link e non spiega come inserire uno slideshow come sfondo ma dice solo di inserire un'immagine e renderebtutto il resto trasparente....quyello che vorrei io è avere i codici che website x5 usa per il proprio slideshow e posizionarli come sfondo in maniera da avere la stessa idea di come l'ho fatto ora ma lo slideshow a tutta pagina...guarda il mio sito depalmas.it e capisci cosa intendo.....voglio fare questo perchèin questo modo posso rimpicciolire le dimensioni del contenuto pagina ( attualmente 1366 ) e portarle a 980 in maniera da renderlo visibile bene a tutti ( anche con risoluzioni minime ).....grazie
... per le spiegazioni, come detto, dovresti provare a contattare Mirko, ... che magari potrebbe avere l'adattamento per il tuo caso...
...
... effettivamente la dimensione in larghezza è eccessiva rispetto alla definizione che va per la maggiora...
... per quanto riguarda lo slideshow della pagina usando il programma, secondo me dovresti farlo che stia perfettamente adattato al layout, come nel sito di WebSiteX5, che ritengo la soluzione migliore tra quelle che si vedono in giro; ...più o meno quello che hai già fatto...
... altrimenti, per soluzioni esterne, c'è anche quella proposta da Skeggia: http://answers.websitex5.com/post/91903
.
ciao
Ciao, io ho fatto così:
in allegato troverai una cartella zip con tutti i js+css necessari a far funzionare l'ambaradam; estrai i files in una cartella e carica dal pannello di controllo online i files contenuti; crea inoltre sempre dal pannello di controllo, una cartella che chiamerai "immagini" (potresti chiamarla come vuoi tu, ma poi devi modificare il codice sottostante) e carica le immagini che vorrai facciano parte del tuo slide, rinominandole come nel codice (back1.jpg ecc.) (come prima, potresti chiamarle come vuoi, ma necessariamente devi modificare il codice); una volta fatte queste operazioni (a me sembrava impossibile da realizzarle!) dovrai implementare in impostazioni generali sezione esperto il codice sottostante: - la prima parte la copierai nella sezione "head", e la seconda parte (esclusa la frase "inserire in body") nella sezione "body".
Puoi inserire quante immagini vuoi semplicemente allungando la lista.
Attenzione! il tuo slide funzionerà soltanto quando avrai esportato il sito online, dall'anteprima di websitex5 non vedrai nulla.
In bocca al lupo.
-------------------------------------------------------------------------------------
<meta charset="utf-8">
<title>Vegas Background jQuery Plugin</title>
<meta name="description" content="Vegas is a jQuery plugin to add beautiful fullscreen backgrounds to your webpages. You can even create amazing Slideshows.">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<script type="text/javascript" src="http://jaysalvat.github.io/vegas/releases/latest/jquery.vegas.min.js"></script>
<script>
$( function() {
$.vegas( 'slideshow', {
delay: 8000,
backgrounds: [
{ src: 'immagini/back1.jpg', fade: 4000 },
{ src: 'immagini/back2.jpg', fade: 4000 },
{ src: 'immagini/back3.jpg', fade: 4000 },
{ src: 'immagini/back4.jpg', fade: 4000 },
{ src: 'immagini/back5.jpg', fade: 4000 }
]
} )( 'overlay' );
$( '.documentation' ).click( function() {
$( 'ul ul' ).slideToggle();
return false;
});
$( '#overlay, #credits, #download' ).click( function() {
$( '#overlay, #credits, #download' ).fadeOut();
return false;
});
$("#superheader h6").click(function(e) {
var $$ = $( this ),
$menu = $('#superheader ul');
e.stopPropagation();
if ( $menu.is(':visible') ) {
$menu.hide();
$$.removeClass( 'open' );
} else {
$menu.show();
$$.addClass( 'open' );
$('body').one('click', function() {
$('#superheader ul').hide();
});
}
});
$( "#superheader li" ).click( function( e ) {
document.location = $( this ).find( 'a' ).attr( 'href' );
});
$( '.download' ).click( function() {
$( '#overlay, #download' ).show();
});
} );
</script>
inserire in body
<div id="container">
<div class="arrow"></div>
</div>
in: www.evoluzionevirtuale.it potrai verificarne il funzionamento.
Ciao.
Ciao Gabriele,
nelle tue istruzioni c'è qualcosa che non torna. Hai suggerito di inserire tutti i file presenti nello zip sul server ma nella tua pagina hai richiamato il file javascript da github.
Posto che comunque non servirebbero tutti quanti, a che servono i file .js e .css sul server?
Aggiungo: quel br inserito in head, i tag meta e title duplicati vanno tolti.
Ciao Stesil,
questo è un'esperimento da me fatto ed andato a buon fine; dei files nel zip, quelli necessari sonoi files .js e .css, le immagini presenti sono accessori; per il resto senza dubbio c'è qualche tag duplicato, ma...la perfezione... del resto avevo già eliminato molto...ad ogni modo, nonostante qualche duplicato il tutto gira senza problemi; se credi, puoi eliminare il superfluo senza problemi, magari...ne approfitto anch'io.
Ciao.
Non hai capito!
Certo che l'esempio funziona, il file su github c'è! Tu hai inserito dei files che non hai usato: non sono imperfezioni, è un errore di logica.
Comunque grazie, se dovessi implementarlo toglierò sicuramente i file meta, e anche altro.
Ciao.
... ho visto il tuo link, un bell'esempio di sfondo, simile a quello di Mirko...
... se osservi il sorgente del codice in Firefox, noterai un errore in rosso, che per evitarlo basta che elimini il TAG <Br> segnato qui:
...
... per non rimanere vincolato al sito dell'autore, scarica il file jquery.vegas.min.js ...lo posizioni nel tuo sito, e ne correggi il richiamo con la Path relativa ad esso, per esempio:
<script type="text/javascript" src="files/jquery.vegas.min.js"></script>
.
ciao
Grazie Kol,
mi hai anticipato; grazie alla critica costruttiva di Stesil, ho fatto altre prove, ed in effetti aveva pienamente ragione; ho eliminato molte cose inutili, ma l'ultimo tuo appunto PREZIOSO mi permetterà di affrancarmi da github.
Appena avrò fatto queste ultime modifiche sarò felice di condividere.
Ciao.
...purtroppo debbo sempre inserire il collegamento a github, altrimenti non funziona; ho fatto le prove su un sottodominio: www.evoluzionevirtuale.it/recipes;
ho inserito i files .js e .css preventivamente, ma...
per ora va bene così,
ciao.
... deve funzionare...
... anche se sono senza strumenti, ... ho provato la tua pagina messa su un blocco note e con il JS scaricato e messo nello spazio web dei miei test: http://www.zspace.it/kolasim/spazzatura/gabriele.html
... tutte le relazioni sono con il tuo SITO, tranne il J.S. prelevato dalla stessa mia directory in questo modo:
<script type="text/javascript" src="jquery_vegas_min.js"></script>
... che puoi verificare da te dal codice sorgente...
... comunque, anche il tuo è un bell'esempio di ridimensionamento corretto...
.
ciao
...ricontrollo...Kol...sai qual'è il problema per quelli come me che vorrebbero delle iniezioni istantanee di conoscenze? che pochi, anche su questo forum, se si eccettuano te e Mirko, sono disposti ad offrire la loro conoscenza acquisita; vaghi e sfuggenti; sbagliando, se ho realizzato qualcosa è soprattutto grazie ad autori Americani, che molto spesso hanno messo a disposizione, senza nulla chiedere, il loro sapere; debbo riconoscere ad ogni modo, che certe modifiche avvenute successivamente a qualche esperimento, per migliorarlo, sono state possibili anche al coinvolgimento di Skeggia; comunque, sarebbe troppo bello svegliarsi la mattina imbottiti di sapienza; quindi, vi prego, reagite, come ora, alle provocazioni; la mia è una ricerca costante di miglioramento, quindi un grazie a tutte le doverose critiche.
Ciao
... nessuno nasce imparato, , ... e guando avrai acquisito qualcosa, l'importate sarà riuscire a rimanere se stessi...!...
.
....e buona ricerca...
...l'ultimo errore...avrei dovuto creare preventivamente la cartella "files".
Ciao Kol, grazie, ora gira.
P.S. credo che a questo punto chiunque possa estrapolare il codice finale dall'embrione postato da me precedentemente.
... penso proprio di sì, anche se non so se possa essere legale l'uso di codice non autorizzato; ...bisognerebbe andare a vedere nel sito dell'autore del codice...
.
ciao
Questa è la fonte del plugin utilizzato: http://vegas.jaysalvat.com/ ed è di libero utilizzo (licenza MIT).
@Gabriele
Sono stata di poche parole, è vero, ma tu hai inserito una guida, non una richiesta di aiuto.
Un posto alternativo a questo social help center, dove c'è gente disposta a condividere le conoscenze acquisite c'è: http://www.unofficialwsx5.com/
...nessun americano presente
Felice che tu abbia sistemato tutto.
@Gabriele
"Un aspetto essenziale della creatività è non avere paura di sbagliare"
(Edwin Land)
segui il consiglio di stesil
Grazie a tutti, felice di far parte di questo forum.
Ciao.