Testo a comparsa

17-08-2011, 13.38.29

Ciao. E' possibile creare un testo che faccia comparsa automaticamente con dissolvenza? Come ? grazie in anticipo

**alemoppo** · 17-08-2011, 14.00.06

Il modo più semplice è usare .animate() di jQuery (in particolare, dovresti far variare la proprietà "opacity". Qui un esempio, ma invece del testo ci avevo messo un immagine...).
Per farlo funzionare ricordati di includere il file jQuery!

Ciao!

17-08-2011, 14.06.11

grazie ma il problema è che io non so niente di javascript.... mi puoi spiegare meglio?

**alemoppo** · 17-08-2011, 14.17.23

ah...
[pappaproonta

]
Tra i tag <head> e </head> inserisci:

Codice:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.js"></script>
<script type="text/javascript">
$(document).ready(function () {
   $(".testo_entrata").animate({
    opacity: 1,
  }, 2000);
});
</script>

...Mentre questo è il testo (devi dargli una classe "testo-entrata"):

Codice HTML:

<span class='testo_entrata' style='opacity:0'>testo testo testoooooo</span>

..Puoi regolare la velocità modificando il numero "2000".
[/pappapronta]

Ciao!

17-08-2011, 14.35.02

[grazie]gracias...[/grazie]

EDIT:

potrei anche sapere come si fa a fare un movimento? grazie

**alemoppo** · 19-08-2011, 11.40.45

Leggiti .animate().

Invece di opacity, puoi mettere qualsiasi proprietà css (tranne alcune, ad esempio color...). Puoi metterne anche più di una, come mostrano chiaramente gli esempi nella pagina linkata...

Ciao!

19-08-2011, 11.44.33

ok grazie. Ciao

25-08-2011, 08.56.22

ciao non funziona più il testo a comparsa... mi puoi dire perchè? la pagina è http://www.phpbg.altervista.org/index.html
grazie

**alemoppo** · 25-08-2011, 13.23.45

Se vuoi metterlo tra <p>, allora lo span esterno non ha senso. Fai tutto con <p>:

Codice HTML:

<p class="home" align="center" style='opacity:0'>
FXBOX1 è il sito di Formula uno dedicato al proprio gioco, con video, settaggi e consigli di tutte le piste del campionato 2010</p>

Cambiando il riferimento nello script a home:

Codice:

$(document).ready(function () {
   $(".home").animate({
    opacity: 1,
  }, 2000);
});

p.s: quando avrai più confidenza con css, ricorda di mettere tutte le proprietà css nella parte di codice tra "<style></style>" (creando eventuali classi/id). Poi metti il tutto in un file esterno...

Ciao!

Discussione: Testo a comparsa

LinkBack

Strumenti discussione

Display

Testo a comparsa

Regole di scrittura