Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript]przejscie grafiki
Forum PHP.pl > Forum > Przedszkole
atom90
14.10.2014, 08:24:38
Jak najlepiej zrobic przejscie dla 2 grafik
1. stara grafika zanika i w tym samym czasie pojawia sie na niej nowa, po jakims czasie znow jest stara i tak w kolko
2. miedzy tym pokazuje sie napis z informacja np "zmieniamy sie na:"
grafiki maja te same wymiary
Turson
14.10.2014, 08:35:37
jQuery fadeIn, fadeOut
atom90
14.10.2014, 08:41:17
no tak, ale jak to zrobic by nakladaly sie jakos ustawiac background czy cos z pozycjonowaniem divow, a nie ze jeden zanika i pojawia sie w tym samym czasie obok drugi
markuz
14.10.2014, 08:44:00
np. 
[CSS] pobierz, plaintext 
  1.  div { position: absolute; top: 0; left: 0; }
[CSS] pobierz, plaintext
atom90
14.10.2014, 08:49:21
Kod
    <style>
        #change{
            width: 191px;
            height: 90px;
            background: yellow;
            position:absolute;
        }
        #image2{
            position:absolute;
            left:0;
            display:none;
        }

    </style>
</head>
<body>


<div id="change"><img id="image1" alt="old" src="img1"><img id="image2" alt="new" src=img2"> </div>
<script src="jquery-2.1.1.min.js"></script>
<script>

    $(document).ready(function () {
        $('#image1').fadeOut(2000);
        $('#image2').fadeIn(2000);
        });
</script>
</body>



czyli cos w tym stylu?
czy lepiej jednak dac te grafiki jako tlo divow i ukrywac divy
markuz
14.10.2014, 09:22:15
http://jsfiddle.net/b7fsqjd4/
atom90
14.10.2014, 10:30:01
Kod
$(document).ready(function () {

                $('#image1').fadeOut(3000);
                $('#newtext').fadeIn(3000);
                $('#newtext').fadeOut(3000);
                setTimeout(function () {
                    $('#image2').fadeIn(3000);
                }, 3000);
                setTimeout(function () {
                    $('#image2').fadeOut(3000);
                    $('#image1').fadeIn(3000);
                }, 10000);
          
        });

takie cosik zrobilem, a jakby to teraz fajnie zapetlic by w kolko sie wykonywalo
Turson
14.10.2014, 10:31:43
setInterval()
atom90
14.10.2014, 11:13:37
no uzywałem to, ale nie wiem jaki sensowny czas ustawic na to by to chodzilo mechanicznie jak trzeba
markuz
14.10.2014, 11:27:54
Zsumuj czas w ms przez jaki wykonuje się twoja animacja a potem wykonuj ten skrypt za pomoca setInterval.
ShaggyAG
15.10.2014, 00:06:29
http://jsfiddle.net/b7fsqjd4/2/
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.