Created
October 3, 2018 10:27
-
-
Save alisnic/6927bd8cc49ac3edd992cf711de73e23 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Page title</title> | |
| </head> | |
| <body> | |
| <div id="list"> | |
| <div class="card"> | |
| <h1>Title</h1> | |
| <p>very, very, very long description</p> | |
| </div> | |
| </div> | |
| <script type="text/javascript"> | |
| var totalCards = 1; | |
| function renderCard() { | |
| var card = el.cloneNode(true); | |
| list.appendChild(card); | |
| totalCards += 1; | |
| } | |
| document.addEventListener("scroll", (event) => { | |
| if ((window.innerHeight + window.scrollY) < document.body.offsetHeight) { | |
| return | |
| } | |
| if (totalCards >= 30) return; | |
| setTimeout(renderCard, 200) | |
| }) | |
| var el = document.querySelectorAll(".card")[0] | |
| for (var i = 0; i < 20; i++) { | |
| renderCard() | |
| } | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment