¿Sería mejor para implementar cada pestaña como una capa HTML diferente y tener botones de control que la capa aparece en la parte superior? ¿Sería mejor en lugar de (re) generar HTML sobre la marcha cuando se presionan los botones de tabulación ?
me inclinaría hacia la generación del contenido una vez y mostrar/ocultar en la demanda, especialmente si la mayoría del trabajo se realiza en el navegador y no hay peticiones síncronas que se están realizando a un servidor en la interacción con elementos de la página . Véase la nota 1
Al mostrar el contenido de una pestaña ...
Suponiendo que el contenido de cada pestaña genera rápidamente, puede hacer su uso más eficiente sólo por la creación del contenido de la pestaña cuando se solicita la primera vez. De esta forma, si nunca se accede a la pestaña, no se utilizan recursos.
Cuando ocultar el contenido de una pestaña ...
Cuando se trabaja con multimedia puede que tenga que realizar acciones adicionales al ocultar el contenido. Por ejemplo, un video no se detendrá solo porque lo ocultes. Para su aplicación de audio, puede que necesite detener la reproducción de la secuencia actual.
Hay muchos controles de pestañas disponibles, como jQuery UI tabs (gratis) y Sliding Tabs (con licencia pero de bajo costo).
otros escenarios
aquí se deben utilizar para la conmutación entre los principales bloques de contenido como documentos (por ejemplo las pestañas del navegador) y/o la funcionalidad se utiliza regularmente (por ejemplo, un formulario de personal que tiene una pestaña de información de contacto y otro para el empleo historia). Otros escenarios pueden ser más adecuados para un diálogo (modal o no modal).
Utilizando el ejemplo de audio, si tuviera un botón con la etiqueta "tempo", esperaría que abriera un pequeño cuadro de diálogo sobre mi vista actual en lugar de llevarme a una pestaña nueva. Roland's workstation keyboards usa este paradigma. El contenido principal reemplaza la vista actual, pero las ventanas de configuración/configuración generalmente aparecen en la parte superior de la vista existente.
jQuery UI también tiene un complemento de diálogo para este fin. Si tiene conocimientos de JavaScript y se dirige a navegadores más nuevos, no es tan difícil escribir su propio diálogo simple.
1 contenido Generación sobre la marcha todavía puede ser perfectamente aceptable con una relación cliente-servidor interactivo, pero introduce consideraciones adicionales, tales como la sincronización de lo que es en el navegador con el modelo de datos en el servidor (si lo hay), la presentación de campos de formulario (que no sean necesarios aumentando el tamaño de la solicitud), el tamaño total de la página, etc.
diversión de demostración gracias! – kaveman
Esa es una demo genial, solo fyi. Pasé 10 minutos jugando con eso. +2 si pudiera, parece que esto va a algún lado. –