• Regolamento Macrocategoria DEV
    Prima di aprire un topic nella Macrocategoria DEV, è bene leggerne il suo regolamento. Sei un'azienda o un hosting/provider? Qui sono anche contenute informazioni per collaborare con Sciax2 ed ottenere l'accredito nella nostra community!

Problema risolto Css - E' possibile aggiungere un effetto di transizione appena... [Continua a leggere]

Paperino1870

Utente Normale
Autore del topic
13 Agosto 2011
73
47
Miglior risposta
0
E' possibile aggiungere un effetto di transizione appena entro in una pagina ad esempio nel mio blog, e c'è tipo un fade bianco?



Cioè, una schermata bianca che si dissolve lentamente fino a mostrare il sito completo, usando il css.

Grazie.
 
Riferimento: Css - E' possibile aggiungere un effetto di transizione appena... [Continua a

Anche se il post è di parecchi giorni fa, mi è venuta la brillante idea di risolvere lo stesso il problema, ricorrendo a mezzi esterni.
Oltre ad una parte di CSS, utilizzeremo anche il JQuery:
Parte CSS:
Utilizziamo un div bianco in posizione absolute, e quindi mettiamo lo z-index maggiore fra tutti gli elementi presenti nella pagina HTML.
Codice:
Perfavore, Entra oppure Registrati per vedere i codici!

Ora, invece, andiamo a vedere la parte
JQUERY:

Andremo semplicemente ad utilizzare la funzione fadeOut() con la durata di 3000 millisecondi:
Codice:
Perfavore, Entra oppure Registrati per vedere i codici!

E con questo abbiamo finito xD
Se volete documentarvi sulla funzione .fadeOut(), andate
Perfavore, Entra oppure Registrati per vedere i Link!

Ciaooo :emoji_slight_smile:
 
Riferimento: Css - E' possibile aggiungere un effetto di transizione appena... [Continua a

Anche se il post è di parecchi giorni fa, mi è venuta la brillante idea di risolvere lo stesso il problema, ricorrendo a mezzi esterni.
Oltre ad una parte di CSS, utilizzeremo anche il JQuery:
Parte CSS:
Utilizziamo un div bianco in posizione absolute, e quindi mettiamo lo z-index maggiore fra tutti gli elementi presenti nella pagina HTML.
Codice:
Perfavore, Entra oppure Registrati per vedere i codici!

Ora, invece, andiamo a vedere la parte
JQUERY:

Andremo semplicemente ad utilizzare la funzione fadeOut() con la durata di 3000 millisecondi:
Codice:
Perfavore, Entra oppure Registrati per vedere i codici!

E con questo abbiamo finito xD
Se volete documentarvi sulla funzione .fadeOut(), andate
Perfavore, Entra oppure Registrati per vedere i Link!

Ciaooo :emoji_slight_smile:

Bravissimo ^^ Rinomino e sposto
 
Riferimento: Css - E' possibile aggiungere un effetto di transizione appena... [Continua a

@Patrizio99 ti ringrazio per avermi risposto, mi rimane un unico problema, dove lo posiziono il codice Jquery? ho provato a metterlo dopo <body> ma non funziona , ho provato su <script type="text/javascript"> e neanche, come faccio?
 
Riferimento: Css - E' possibile aggiungere un effetto di transizione appena... [Continua a

Hai ragione, mi sono dimenticato di spiegarlo xD
JQuery essendo una libreria esterna, la devi includere.
Quindi facciamo:
Codice:
Perfavore, Entra oppure Registrati per vedere i codici!
Poi il codice Jquery lo devi inserire nell'<head>
Spero di essere stato chiaro. Se qualcosa ti turba, non esitare a chiedere xD
 
Riferimento: Css - E' possibile aggiungere un effetto di transizione appena... [Continua a

caro @Patrizio99,
ho provato a mettere il codice nell'<head> ma non fa niente, per quanto riguarda lo l'altro codice che mi hai dato
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

dove lo metto...? scusa se ti faccio perdere tempo, non so praticamente niente, ho provato a fare tipo cosi:
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js">$(document).ready(function(){
$('#fade').fadeOut(3000);
});</script>

<--etc..

</head>

poi cosi

<head>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

$(document).ready(function(){
$('#fade').fadeOut(3000);
});
</head>

ma niente, che nel mio blog questa funzione non funzioni o sbaglio qualcosa io? non so propio come collocarlo.
 
Ultima modifica:
Riferimento: Css - E' possibile aggiungere un effetto di transizione appena... [Continua a

Codice:
Perfavore, Entra oppure Registrati per vedere i codici!
Ha un <script type="text/javascript">(per il resto la seconda va bene)
ovvero:
Codice:
Perfavore, Entra oppure Registrati per vedere i codici!
Comunque tranquillo, non mi fai perdere tempo xD
 
Riferimento: Css - E' possibile aggiungere un effetto di transizione appena... [Continua a

@Patrizio99 Mmn ho provato a metterlo , forse su tumblr. non me lo supporta...

io non so, non capisco perché non mi funziona propio, provo a metterti l'intero tema senza le modifiche, almeno mi segni tu i punti, perfavore, almeno forse è più chiaro.

Codice:
Perfavore, Entra oppure Registrati per vedere i codici!
 
Ultima modifica: