Comment ajouter de la charge plus de bouton pour un HTML/CSS de la page?

Je veux faire une simple page web et il va avoir d'énormes contenu. Supposons qu'il a 1000 photos sur elle. Je ne veux pas que les gens attendre 5 minutes pour charger ma page. Donc, je veux ajouter CHARGER PLUS de bouton sur le bas de la page.

Comment le faire avec HTML/CSS/JS?

Où sont les photos à venir? Êtes-vous emparer de la base de données? Nous ne pouvons pas vraiment vous aider lorsque nous ne connaissons pas la source des photos.
des photos seront hébergé sur mon site web.. juste comme des poteaux de blog
Oui, mais comment êtes-vous de les ajouter à la page web? Avec PHP?
Supposons que j'ai 100 <div> sur ma page. Je veux montrer à 10 à l'heure et ajouter une charge plus de page en bas.
Avec le HTML/CSS ou JS est-ce possible?

OriginalL'auteur Saiful Islam | 2011-12-02

  1. 13

    Vous pouvez définir tous les divs' display:none; au premier abord et ensuite utiliser jQuery pour afficher les 10 premiers (ou cependant beaucoup que vous souhaitez montrer):

    $(function(){
    $("div").slice(0, 10).show(); //select the first ten
    $("#load").click(function(e){ //click event for load more
        e.preventDefault();
        $("div:hidden").slice(0, 10).show(); //select next 10 hidden divs and show them
        if($("div:hidden").length == 0){ //check if any hidden divs still exist
            alert("No more divs"); //alert if there are none left
        }
    });
});

    Exemple.

    Cela vous évite d', y compris un ensemble de plug-in lorsque ce que vous voulez peut être atteint en quelques lignes de code.

    J'ai besoin de vous contacter. Sur Twitter ou Facebook.
    Vous pouvez m'envoyer un email à l'e-mail sur mon profil.
    Vous a envoyé un e-mail à partir de G+
    Y compris un plugin peut-être une bonne idée, au lieu de charger toute la base de données d'une div.
    Désolé de relancer un vieux post, mais je viens de tomber sur ce vouloir faire quelque chose de similaire. Quelqu'un pourrait-il préciser si cela réduit les temps de chargement? De ma compréhension, cette méthode serait encore en charge toutes les div de chargement de page, juste ne pas le montrer, ce qui irait à l'encontre de l'objectif de la "charger plus", à droite? Si je ne me trompe...

    OriginalL'auteur Purag

  2. 1

    Le plus proche que je peux obtenir la lecture de votre question, vous voulez que l'effet que google et facebook utilise de nos jours pour charger des postes.

    Visite infinite-scroll.com
    Ils ont votre réponse.

    comme vous êtes nouveau ici, je vais vous rappeler à accepter une réponse acceptée, de sorte que d'autres visiteurs qui ont le même problème sera de savoir quelle solution a fonctionné. Cliquez simplement sur le petit right icône sur le côté gauche de l'réponses.

    OriginalL'auteur Starx

  3. 1

    maliste id l'id de ma balise ul.

    x=9 donne à 9 vues à partir de la première encore, vous pouvez le charger à nouveau à un temps plus que 3 sera chargé. 

    $j(document).ready(function () {
        size_li = $j("#myList li").size();
        x=9;
        $j('#myList li:lt('+x+')').show();
        $j('#loadMore').click(function () {
            x= (x+3 <= size_li) ? x+3 : size_li;
            $j('#myList li:lt('+x+')').show();
        });
    });

    OriginalL'auteur Ashwin Shahi

  4. 0

    ne sais pas si vous avez un serveur d'arrière-plan ou quelque chose comme ça, mais de toute façon, vous pouvez essayer un peu de javascript (moteur de template comme jQuery Template, moustache etc.

    et de charger les images dynamiquement en js serait une solution 🙂

    OriginalL'auteur Ya Zhuang