Opera fait défiler la page aux éléments invisibles

Question

Je travaille sur un moteur de jeu simple en Javascript (fou, je sais.) Capture d'écran de l'opéra: http://img406.imageshack.us/img406/5818/gamek.jpg Bien qu'il ressemble à un moteur de tuile, il est réellement basé sur l'objet; chaque ligne ou colonne de blocs gris est une seule < div>, positionnée par rapport à la zone de visualisation (boîte avec bordure rouge). La zone de visualisation a un débordement: masqué, les objets n'apparaissent pas à l'extérieur. Toutefois, Opera ajoute toujours la hauteur totale de ces objets à la hauteur totale de la page, même si la plus grande partie est découpée. C'est curieux car aucune barre de défilement ne s'affiche, et le contour bleu autour de l'élément < html> ne se déplace pas vers le bas (ni si je le mets sur l'élément < body). Mais quand j'appuie sur la flèche vers le bas, la page défile vers le bas, jusqu'à ce que le bas de ces objets soit à l'écran, même s'ils sont coupés. Je peux dire que c'est le cas car la suppression de ces objets résout le problème, et comme je me déplace vers le sud dans le jeu, la page défile vers le haut, puisque les objets remontent et réduisent ainsi la hauteur de la page. J'utilise Opera 10, mais j'ai eu le même problème avec 9. Firefox le gère très bien. Comment pourrais-je résoudre ou contourner ce problème? Aucune supercherie CSS à laquelle je peux penser ne l'a fait, et l'appel de scroll (0,0) à chaque image est encore pire - la page saute au "bas", puis revient en haut.

Answer 1

c'est un bug connu dans Opera que vous pouvez faire défiler le contenu qui est censé être overflow: hidden.

Maintenant, si vous gérez l'événement keypress avec JavaScript et appelez event.preventDefault() pour les touches fléchées, cela empêchera le défilement. (Ne fonctionne pas pour empêcher l'action par défaut de l'événement keydown, il faut appuyer sur une touche). Est ce que ça aide?

Answer 2

Ce problème se produit-il également dans Safari? Si tel est le cas, cela pourrait être un problème spécifique à WebKit. Ou peut-être que la spécification d'un max-height pour cet élément pourrait empêcher cet objet de redimensionner la fenêtre de votre navigateur.

code source aussi serait bien trop =)