La página Samsung Smart TV se desplaza fuera de la vista en respuesta a presionar teclas arriba

Question

Tengo una aplicación Smart Smart TV que muestra una lista de elementos en una lista vertical con un manejador de teclas conectado a un ancla asociada con el DIV que contiene lista.

La lista comprende un conjunto de DIV que muestra una cadena de texto en cada uno encerrado por un DIV externo. La altura de la lista completa es de 400 px, dentro de los 540 px de la altura de la pantalla.

El usuario puede subir y bajar la lista con los botones hacia arriba y hacia abajo para resaltar los elementos individuales.

En el emulador funciona bien, sin embargo, en un televisor real cuando el usuario golpea hacia abajo, no solo el movimiento de resaltado se realiza como debería, sino que toda la pantalla se mueve hacia arriba.

Del mismo modo, cuando el usuario golpea, el resaltado se mueve correctamente pero la pantalla se mueve hacia arriba.

Aquí está el marcado de la lista

<div id="itemList"> 
    <div class="slot" id="slot0">Slot 0</div> 
    <div class="slot" id="slot1">Slot 1</div> 
    <div class="slot" id="slot2">Slot 2</div> 
    <div class="slot" id="slot3">Slot 3</div> 
    <div class="slot" id="slot4">Slot 4</div> 
</div> 
<a href='javascript:void(0);' id='anchorList' onkeydown='KeyHandler.list_KeyPress()'></a> 

Aquí está la CSS

#itemList { 
    position: absolute; 
    left: 20px; 
    top: 20px; 
    width: 250px; 
    height: 400px; 
    background-color: #000000; 
} 

#itemList .slot { 
    color: #ff0000; 
    width: 100%; 
    height: 80px; 
} 

Los incrementos función de eventos list_KeyPress o disminuye el índice del elemento resaltado y cambia la clase de ella para slotSelected

No se está redibujando, moviendo o redimensionando nada en la pantalla. El único cambio que se está realizando es la clase del DIV resaltado.

Para eliminar esto como un factor, comente el código dentro de list_KeyPress() y sigo teniendo el mismo problema, por lo que no es eso.

Definitivamente tiene algo que ver con las pulsaciones de teclas.

Answer 1

En realidad, lo he resuelto yo mismo. En el CSS agregué lo siguiente al cuerpo y al estilo html:

body, html { 
    overflow: hidden; 
}