¿Qué es mejor para los menús desplegables, CSS + jQuery o Pure CSS?

Depende de cómo se defina “mejor”. Sería más fácil hacerlo solo con CSS. Será más útil si usa jQuery y CSS. Con solo CSS, no hay demora en la desaparición del menú, lo que puede ser realmente frustrante para los usuarios, y limita los eventos disponibles que puede usar para activar los menús (el desplazamiento es el único con el que puede contar, y con los dispositivos móviles, puede ni siquiera cuento con eso más).

Al usar javascript (jQuery, Dojo u otro marco lo hará más fácil, pero puede hacerlo solo con javascript), puede agregar un retraso para que el menú permanezca abierto un poco después del evento de mouseout, puede agregar otros efectos o active el menú al hacer clic y cambie otros elementos en la página cuando cambie el estado del menú.

Recomiendo crear el menú con una serie de listas en HTML. Una vez que haya realizado el marcado, puede probar ambos enfoques y ver cuál funciona mejor para sus necesidades.

CSS puro, aunque con solo una pizca de JavaScript para usabilidad:

JavaScript se puede utilizar para cumplir con una de las pautas de usabilidad de Jakob Nielsen: forzar un retraso de 500 milisegundos desde el momento en que un usuario comienza a desplazarse hasta que aparezca el menú desplegable, y otros 500 ms desde el momento en que el mouse abandona el estado de desplazamiento hasta que desaparece.

Aquí está el artículo original de Nielsen donde habla sobre la importancia de los límites de tiempo de respuesta ( http://www.useit.com/alertbox/me …) y aquí hay un excelente artículo en SitePoint que detalla cómo hacer fácilmente un menú desplegable CSS puro, así como cómo presentar el retraso de 500 ms ( http://www.sitepoint.com/make-a- …).

Yo diría puro CSS3. Principalmente porque creo que usar la funcionalidad nativa es el primer paso en la optimización del código. No debe cargar su aplicación con bibliotecas innecesarias. Por otro lado, las animaciones CSS3 también parecen ser más fluidas. Así es como es.

Las animaciones CSS son compatibles desde IE10 en adelante, lo que significa que no es gran cosa de ese lado si le preocupan sus visitantes. Según la popularización de datos, puede detectar cambios de estado en los selectores de CSS a través de vanilla JS o, si lo desea, utilizando una de las pequeñas bibliotecas, puede elegir entre Fantastic Micro-Frameworks y Micro-Libraries for Fun and Profit. y arregla lo que quieras dentro de los elementos de tu menú.

Su herramienta más grande en esta búsqueda sería :hover :before y :after pseudo selectors.