Skrollr - Comment arrêter la div arrêter le défilement lorsqu'ils atteignent le haut de l'ot de la fenêtre
Je suis en train de faire mon site en utilisant Skrollr (bibliothèque javascript): http://prinzhorn.github.io/skrollr/
La scrollr fonctionne bien, mais je ne suis pas en mesure de comprendre une chose.
Comment puis-je arrêter un div défilement plus loin à partir du haut de l'écran.
Une fois le sommet de la div frappe le haut de ma page, je le veux pour arrêter le défilement, de sorte que lorsque le deuxième div commence à venir sur le dessus de cela, il donne le sentiment d'une pile de cartes.
Et lors du défilement en arrière, la div commence à défiler après celui en haut a gauche en bas de la page.
J'espère que mon explication est un peu clair, si non je vais essayer de l'expliquer à l'aide de graphiques.
Maintenant le code de la partie.
Après la lecture de la documentation, j'ai essayé les deux:
data-top
et
data-end
aucun d'entre eux travaillaient en fait.
J'ai aussi essayé:
data-top="background-position:0px 0px;"
Je ne sais même pas si ce que je veux réaliser est possible ou pas.
Si pas,
puis-je faire chevauchement de défilement vertical par la réduction de la vitesse de défilement après le sommet de la div traverse le haut de la fenêtre du navigateur.
Veuillez me demander si mes explication est confuse, je sais que c'est pas facile à expliquer le problème de vive voix.
OriginalL'auteur ssdesign | 2013-05-04
Vous devez vous connecter pour publier un commentaire.
skrollr ne fait pas de magie, juste en CSS. Si vous voulez la div à l'arrêt, puis de trouver un moyen de le faire à l'aide de CSS. Habituellement, cela est accompli à l'aide de correction du positionnement.
Comme ça (pas testé, mais devrait vous donner l'idée)
Maintenant un problème va probablement se produire. Tous les éléments suivants déplacer vers le haut, parce que l'élément est retiré de la circulation. Vous pouvez résoudre ce par exemple à l'aide d'un mannequin-élément ou
margin-top
outop
(avec le positionnement relatif) en collaboration avecdata-anchor-target
pointant sur l'élément.top:0;
dans votre CSSOriginalL'auteur Prinzhorn
Il suffit de spécifier la période pour laquelle vous souhaitez rester au sommet en ayant deux points de données (défilement des distances) et de maintenir le haut css de la même façon.... voir ci-dessous.
0
n'ont pas d'unité.note: dans skrollr le css valeur 0 doit disposer d'une unité; en particulier, une unité qui correspond à l'appareil que vous utilisez dans ses correspondants de données de l'attribut (par exemple 0px -> 100px ou 0% -> 100%). "Toutes les valeurs numériques doivent avoir la même unité, même à 0, besoin d'une unité. Il n'est pas possible d'animer de 5% à 100px. skrollr ne se plaignent, mais les résultats ne sont pas définis." à partir de la documentation github.com/Prinzhorn/skrollr
OriginalL'auteur mike smith