Faire les widgets d'écran gauche et droite restent au même endroit pendant que l'utilisateur fait défiler la page avec la barre d'espace

Question

J'ai page Web avec un attribut de grande taille qui affiche des produits. Je veux que l'utilisateur clique sur la barre d'espace pour déplacer la page vers le bas pour voir plus de produits, mais j'ai besoin de mes widgets d'écran (panier & catégories) à gauche et à droite pour rester au même endroit sur l'écran. Et je ne veux pas utiliser les barres de défilement. Je suppose que c'est une demande javascript, quelqu'un peut-il me signaler une bonne ressource pour cela?

Answer 1

Il n'y a aucune raison d'utiliser JavaScript ici - CSS devrait le faire. En utilisant position: fixed, vous pouvez corriger les éléments de votre page de manière à ce qu'ils restent toujours dans une certaine position par rapport à la fenêtre de l'utilisateur. Un exemple illustrera probablement ce meilleur: http://www.jsfiddle.net/yijiang/qtkss/

Pour en savoir plus:

• http://reference.sitepoint.com/css/displaypositionfloat
• http://reference.sitepoint.com/css/display
• http://www.alistapart.com/articles/css-positioning-101/

Answer 2

Vous n'avez pas besoin javascript pour cela, il suffit d'utiliser position: fixed; dans le CSS du widget et définissez les top appropriés, bottom, left et right valeurs sur les widgets. Cela placera les widgets dans un emplacement fixe par rapport à la fenêtre du navigateur plutôt que d'autres éléments dans le code HTML.