NOVINKA! E-learningové kurzy umělé inteligence. Nyní AI za nejlepší ceny. Zjisti více:
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!

Diskuze: Kde najdu článek o scrollování

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity
Avatar
kozak.martin
Člen
Avatar
kozak.martin:10.6.2015 16:48

Ahoj, potřeboval bych poradit, kde bych zde našel nějaký článek o scrollování - postupnému načítání dat na stránku. Díky

 
Odpovědět
10.6.2015 16:48
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na kozak.martin
Neaktivní uživatel:10.6.2015 16:50

https://www.google.sk/search?… je tam veľa dobrých návodov ako na to, vyber si, ktorý sa ti bude zdať najlepší :)

Nahoru Odpovědět
10.6.2015 16:50
Neaktivní uživatelský účet
Avatar
kozak.martin
Člen
Avatar
kozak.martin:12.6.2015 22:17

A nevíš náhodou kde mám problém? Nějak to nemůžu rozchodit. :)

<html>
<head>
<script src="js/jquery.jscroll.min.js"></script>
<script src="js/jquery.jscroll.js"></script>
<script>
$('.jscroll').jscroll({
    loadingHtml: '<img src="loading.gif" alt="Loading" /> Loading...',
    padding: 20,
         autoTrigger: false,
    nextSelector: 'a.jscroll-next:last',
    contentSelector: 'li'
});
</script>
</head>
<body>
  <h2 id="examples">Example 1</h2>

        <div class="scroll" data-ui="jscroll-default">
                        <li>TEXT</li>

                        <div class="next"><a href="example-page2.php">next</a></div>
        </div>
</body>
</html>
 
Nahoru Odpovědět
12.6.2015 22:17
Avatar
Ondřej Langr (andysekcze)
Tvůrce
Avatar
Ondřej Langr (andysekcze):12.6.2015 22:19

nejsem teda nějak moc na JS ale co to takhle dát do externího souboru?

Nahoru Odpovědět
12.6.2015 22:19
I have a charger. I have Note 7. Umh I haven't Note7.
Avatar
kozak.martin
Člen
Avatar
Odpovídá na Ondřej Langr (andysekcze)
kozak.martin:12.6.2015 22:31

Však JS (zde mám uložené soubory jscroll) je externí soubor a taky ho tak načítám...

 
Nahoru Odpovědět
12.6.2015 22:31
Avatar
Ondřej Langr (andysekcze)
Tvůrce
Avatar
Ondřej Langr (andysekcze):12.6.2015 22:34

já myslel ten třetí ... zkus to narvat do body...

Nahoru Odpovědět
12.6.2015 22:34
I have a charger. I have Note 7. Umh I haven't Note7.
Avatar
JMS
Člen
Avatar
Odpovídá na Ondřej Langr (andysekcze)
JMS:12.6.2015 22:40

Proč do body??? :-) Spíš bych viděl problém v tom, že máš špatný selector. Místo

$('.jscroll').jscroll()

zkus

$('.scroll').jscroll()

, když máš div s takovou třídou :-)

Editováno 12.6.2015 22:40
 
Nahoru Odpovědět
12.6.2015 22:40
Avatar
Ondřej Langr (andysekcze)
Tvůrce
Avatar
Ondřej Langr (andysekcze):12.6.2015 22:41

jo sorry... někdy mě opravdu napadají bláznivé nápady :D

Nahoru Odpovědět
12.6.2015 22:41
I have a charger. I have Note 7. Umh I haven't Note7.
Avatar
kozak.martin
Člen
Avatar
Odpovídá na Ondřej Langr (andysekcze)
kozak.martin:12.6.2015 22:41

Tak ani tak to nic neděla, tak fakt nevím

 
Nahoru Odpovědět
12.6.2015 22:41
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na kozak.martin
Neaktivní uživatel:13.6.2015 10:17

Nezapomněl jsi tam náhodnou vložit JQuery? Pluginy ti nepojedou, když ho tam nemáš ;)

Nahoru Odpovědět
13.6.2015 10:17
Neaktivní uživatelský účet
Avatar
kozak.martin
Člen
Avatar
Odpovídá na Neaktivní uživatel
kozak.martin:13.6.2015 13:58

Moje chyba, už jsem tam jquery nahrál, ale i tak se nic neděje.

<script language="javascript" type="text/javascript" src="js/jquery-1.11.3.min.js"></script>

Vážně tu nemá nikdo zkušenosti s jSCroll?

 
Nahoru Odpovědět
13.6.2015 13:58
Avatar
Matyáš Procházka
Člen
Avatar
Odpovídá na kozak.martin
Matyáš Procházka:7.7.2015 22:29

Problém je v tom, že ten script musíš načíst až potom, co se načtou ty elementy ve stránce, jelikož jinak přiřazuješ tu funkci "jscroll" něčemu, co ještě neexistuje. Zkus tedy jednu z těchto možností:

<html>
<head>
<script src="js/jquery.jscroll.min.js"></script>
<script src="js/jquery.jscroll.js"></script>
</head>
<body>
  <h2 id="examples">Example 1</h2>

        <div class="scroll" data-ui="jscroll-default">
                        <li>TEXT</li>

                        <div class="next"><a href="example-page2.php">next</a></div>
        </div>
        <script>
        $('.jscroll').jscroll({
            loadingHtml: '<img src="loading.gif" alt="Loading" /> Loading...',
            padding: 20,
                 autoTrigger: false,
            nextSelector: 'a.jscroll-next:last',
            contentSelector: 'li'
        });
        </script>
</body>
</html>

Nebo pokud máš tedy načtené jQuery takto:

<script>
$(document).ready(function () {
        $('.jscroll').jscroll({
            loadingHtml: '<img src="loading.gif" alt="Loading" /> Loading...',
            padding: 20,
                 autoTrigger: false,
            nextSelector: 'a.jscroll-next:last',
            contentSelector: 'li'
        });
});
</script>
 
Nahoru Odpovědět
7.7.2015 22:29
Avatar
bazywalker
Člen
Avatar
bazywalker:8.7.2015 9:25

Zkusil bych to takto.

<html>
<head>
<script language="javascript" type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script src="js/jquery.jscroll.min.js"></script>
<script src="js/jquery.jscroll.js"></script>
<script>
$(document).ready(function () {
        $('.scroll').jscroll({
            loadingHtml: '<img src="loading.gif" alt="Loading" /> Loading...',
            padding: 20,
                 autoTrigger: false,
            nextSelector: 'a.jscroll-next:last',
            contentSelector: 'li'
        });
});
</script>
</head>
<body>
  <h2 id="examples">Example 1</h2>

        <div class="scroll" data-ui="jscroll-default">
                        <li>TEXT</li>

                        <div class="next"><a href="example-page2.php">next</a></div>
        </div>
</body>
</html>
Editováno 8.7.2015 9:27
 
Nahoru Odpovědět
8.7.2015 9:25
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 13 zpráv z 13.