Autor Zpráva
Enko
Profil
Ahoj,
mám jednom webu jednu podstránku, kde je časově náročnější operace, která zabere cca 2-4 vteřiny (tento čas nejde zkrátit) a rád bych při kliku na odkaz na tuto podstránku ukázal třeba nějaké modální okno s gif obrázkem a případně nějakým kraťoučkým textem, tak aby uživatel věděl, že se něco děje a že stránka se už načítá. Jen se zatím učím v JS a toto neumím úplně udělat. Zřejmě na klik na tento odkaz (klasický <a href="stranka" ... ) navěsím onclick, ale už pak nevím jak pak zpracovat dál zbylé, tak aby se ukázalo třeba nějaké modální a okno, které se po načtení stránky samo zavře. Budu rád nejlépe za nějakou živou ukázku nebo nějaký konkrétní návod případně za nějaké jiné řešení.
Jen doplním, že na stránce již využívám JAK knihovnu od seznam.cz, viz: http://jak.seznam.cz/
Str4wberry
Profil
V podstatě stačí akorát při kliknutí na odkaz přepnout při onclicku viditelnost boxu načítání.

Živá ukázka

Až se stránka načte, obrázek signalisující načítání bude opět skrytý.
Enko
Profil
Str4wberry:
Luxus, dějuju za nápovědu a živou ukázku. Byla velmi nápomocná :-)

Jenom jsem se setkal s tím, že v IE se mi ten gif obrázek vždycky freezne a nehýbe se. Tak jsem to vyřešil podle jiného návodu takto:
<div style="visibility:hidden; margin-left:110px; overflow:hidden; height:0;" id="inprogress">
  <img id="inprogress_img" src="<?php echo APP_ROOT;?>/images/loading.gif">
  <br>
  Zpracovávám. Trvá to jen chvilku...
</div>
a na "onclick" konkrétního <a href... odkazu jsem dal tuto funkci>
<script type="text/javascript">
  function doSubmit() {
    if (! submitted) {
        submitted = true;
        ProgressImg = document.getElementById('inprogress_img');
        document.getElementById("inprogress").style.visibility = "visible";
        document.getElementById("inprogress").style.height = "40px";
        setTimeout("ProgressImg.src = ProgressImg.src",100);
        return true;
        }
    else {
        return false;
        }
    }

</script>
S tímto to šlape perfektně a gif se hýbe i v IE.

Děkuji za pomoc :-)

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: