Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript] tekst pojawiający się z opóźnieniem, Typewriter Effect
artisto
post 12.04.2021, 19:45:07
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 12.04.2021

Ostrzeżenie: (0%)
-----


Witam.

Mam skrypt wywołujący efekt pisania na maszynie.
Jednak napotkałem problem z którym nie mogę sobie poradzić.

Zależy mi aby drugi tekst pojawiał się z odpowiednim opóźnieniem (np. 5 sekund).
Forma skryptu jest nietypowa ponieważ zależało mi na 2 oddzielnych niezależnych częściach ale zarazem z możliwością ustawienia czasu wyświetlania między nimi.

  1. <div class="texto1"></div>
  2. <div class="texto2"></div>


  1. <script>
  2. var str = 'part 1 tekst jeden part jeden:';
  3. var str2 = 'part 2 tekst dwa part dwa:';
  4.  
  5. var spans = '<span>' + str.split('').join('</span><span>') + '</span>';
  6. $(spans).hide().appendTo('.texto1').each(function(i) {
  7. $(this).delay(40 * i).css({
  8. display: 'inline',
  9. opacity: 0
  10. }).animate({
  11. opacity: 1
  12. }, 100);
  13. });
  14.  
  15. var spans = '<span>' + str2.split('').join('</span><span>') + '</span>';
  16. $(spans).hide().appendTo('.texto2').each(function(i) {
  17. $(this).delay(40 * i).css({
  18. display: 'inline',
  19. opacity: 0
  20. }).animate({
  21. opacity: 1
  22. }, 100);
  23. });
  24. </script>


Kod dostępny na jsfiddle
https://jsfiddle.net/BDR13/xLvyf0q1/

Czy jest szansa aby ktoś mógł mi w tym pomóc?

Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 14.08.2025 - 02:03