Comment puis-je créer un élément sur une page qui reste toujours visible, mais se déplace hors de la voie d'autres éléments?

Question

J'ai une page HTML qui une disposition assez complexe (

Était-ce utile?

Nous faire parvenir

La solution

Il peut probablement être fait en utilisant JQuery, mais sera toujours nerveux. Je considérerais un DIV fixe. Bien sûr, vous pouvez placer que sous le menu de sorte qu'il ne sera jamais plus (= plus vers le bord supérieur) que le menu, et maintiendra sa position.

.thingy { position: fixed; right: 0px; top: 415px; width: 256px }

Ce NECESSITERAIT qu'il n'y a rien d'autre sous le menu, sinon l'icône du signet se chevauchent d'autres choses.

Answer 1

Il peut probablement être fait en utilisant JQuery, mais sera toujours nerveux. Je considérerais un DIV fixe. Bien sûr, vous pouvez placer que sous le menu de sorte qu'il ne sera jamais plus (= plus vers le bord supérieur) que le menu, et maintiendra sa position.

.thingy { position: fixed; right: 0px; top: 415px; width: 256px }

Ce NECESSITERAIT qu'il n'y a rien d'autre sous le menu, sinon l'icône du signet se chevauchent d'autres choses.

Answer 2

Si vous voulez juste l'image à fixer, mais toujours scrollable en haut de la fenêtre, alors vous aurez besoin pour gérer l'événement de défilement de la fenêtre, et définir la position de l'image à fixe lorsque l'image défile vers le haut .

Pour un exemple, voir la navigation du site sur Quirksmode .

Sinon, vous pouvez donner toute la table des matières position: fixed; right: 0;, donner à la table des matières une largeur et donner le teaser une marge de droite égale à la largeur de la table des matières. Il n'y aurait pas d'obligation JavaScript de cette façon, et vous auriez toujours toute la table des matières visible.