Integrer virtualscroll
Fermé
Utilisateur anonyme
-
Modifié par tibuakaw le 14/02/2015 à 01:05
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 - 15 févr. 2015 à 01:55
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 - 15 févr. 2015 à 01:55
A voir également:
- Integrer virtualscroll
- Intégrer une vidéo dans un powerpoint - Guide
- Intégrer agenda outlook dans google - Guide
- Intégrer liste déroulante excel - Guide
- Intégrer une signature dans word - Guide
- Intégrer un sommaire dans word - Guide
1 réponse
Salut,
dans votre CSS vous déinissez que votre page entière fait 100% de hauteur:
html, body {height:100%;}
Donc comment est il possible que vous ayez des sections qui fassent 100%.
A quoi sert une barre de défilement si tout le contenu est affiché?
Même sans cela si toutes vos sections dans une même page font 100% de sa propre taille cela veut dire que votre page fait n(ombre de sections)*100% donc votre page web fait pour 4 sections 4 fois sa taille... c'est pas très logique mais bon ça peut passer.
Concrètement si vous avez plusieurs sections à afficher indépendamment sur une page pourquoi ne pas faire plusieurs pages? Ou même changer dans la même page le contenu pour afficher l'une ou l'autre des sections?
Votre solution oblige l'utilisateur à s'adapter à votre site alors que c'est l'inverse qui est préconisé pour une bonne ergonomie(facilité et clarté de navigation), avec votre système l'utilisateur doit constamment scroller pour voir le contenu alors qu'un seul clic devrait être nécessaire pour accéder à chaque section.
Le but étant que l'utilisateur: n'en ai pas marre de devoir faire des manipulations ce qui lui donnera pas envie de consulter le site ainsi que de lui apporter un contenu évident et facilement accessible.
Sinon pour javascript vous pouvez l'intégrer à la page:
https://www.google.fr/search?q=int%C3%A9grer+javascrit+%C3%A0+une+page&ie=utf-8&oe=utf-8&gws_rd=cr&ei=PJveVMmGII_OaPjagaAD#q=int%C3%A9grer+javascript+%C3%A0+une+page&spell=1
Ou bien dans un fichier externe(ce qui permet d'utiliser le même script plusieurs fois sans avoir à le réécrire et de modifier celui ci plus facilement):
https://www.google.fr/search?q=int%C3%A9grer+un+javascript+externe&ie=utf-8&oe=utf-8&gws_rd=cr&ei=E5veVL-YOtHbarn7gPAD#q=ins%C3%A9rer+un+javascript+externe
note: ces deux façons d'utiliser javascript se font dans le head et nom dans le body comme il est indiqué dans la structure d'une page web:
<HTML>
<HEAD>
informations et configuration de la page
</HEAD>
<BODY>
la page en elle même, son contenu
</BODY>
</HTML>
dans votre CSS vous déinissez que votre page entière fait 100% de hauteur:
html, body {height:100%;}
Donc comment est il possible que vous ayez des sections qui fassent 100%.
A quoi sert une barre de défilement si tout le contenu est affiché?
Même sans cela si toutes vos sections dans une même page font 100% de sa propre taille cela veut dire que votre page fait n(ombre de sections)*100% donc votre page web fait pour 4 sections 4 fois sa taille... c'est pas très logique mais bon ça peut passer.
Concrètement si vous avez plusieurs sections à afficher indépendamment sur une page pourquoi ne pas faire plusieurs pages? Ou même changer dans la même page le contenu pour afficher l'une ou l'autre des sections?
Votre solution oblige l'utilisateur à s'adapter à votre site alors que c'est l'inverse qui est préconisé pour une bonne ergonomie(facilité et clarté de navigation), avec votre système l'utilisateur doit constamment scroller pour voir le contenu alors qu'un seul clic devrait être nécessaire pour accéder à chaque section.
Le but étant que l'utilisateur: n'en ai pas marre de devoir faire des manipulations ce qui lui donnera pas envie de consulter le site ainsi que de lui apporter un contenu évident et facilement accessible.
Sinon pour javascript vous pouvez l'intégrer à la page:
https://www.google.fr/search?q=int%C3%A9grer+javascrit+%C3%A0+une+page&ie=utf-8&oe=utf-8&gws_rd=cr&ei=PJveVMmGII_OaPjagaAD#q=int%C3%A9grer+javascript+%C3%A0+une+page&spell=1
Ou bien dans un fichier externe(ce qui permet d'utiliser le même script plusieurs fois sans avoir à le réécrire et de modifier celui ci plus facilement):
https://www.google.fr/search?q=int%C3%A9grer+un+javascript+externe&ie=utf-8&oe=utf-8&gws_rd=cr&ei=E5veVL-YOtHbarn7gPAD#q=ins%C3%A9rer+un+javascript+externe
note: ces deux façons d'utiliser javascript se font dans le head et nom dans le body comme il est indiqué dans la structure d'une page web:
<HTML>
<HEAD>
informations et configuration de la page
</HEAD>
<BODY>
la page en elle même, son contenu
</BODY>
</HTML>
Modifié par tibuakaw le 14/02/2015 à 02:06
Modifié par animostab le 15/02/2015 à 02:37
1) body à un overflow: hidden; (et pas un height à 100%)
2) section à une position:absolute
3) tout le contenu est dans un tag <section> (donc du html5) mais tu peux modifier avec une div id en modifiant ligne 82 : var section = document.querySelector("section"); par document.querySlector("#id");
4) le script est appelé comme ceci : <script type="text/javascript" src="../src/framework/VirtualScroll.js"></script> donc facile de le télécharger pour l'utiliser
4) un autre script fait le reste du boulot (en fin de code ligne 79 à 137 avant </body>)
5) dans ce script var ease = 0.1; est la valeur que tu peux modifier pour modifier l'effet du scroll stop
a toi de faire le reste sans aller voir le code source tu ne saura pas comment c'est fait et ca à l'air très simple