• Cuarzo.dev
  • Posts
  • 💎 Ya no me haces falta JavaScript...

💎 Ya no me haces falta JavaScript...

Llegan los popovers nativos a HTML

¡Feliz Jueves!

¿Cómo? ¿Qué ya no necesito javascript para hacer un modal? - Popovers

En el correo de hoy:

  • 📟 Popover nativo en HTML

  • 🌎 Opera lanza navegador con IA

  • 🤖 ¿Photoshop con IA?

Recordatorio: puedes consumir el contenido de este email en formato de audio en nuestro nuevo podcast recién lanzado. ¡Prúebalo y nos cuentas!

Google Chrome 114 incluirá soporte para popover, una nueva API de HTML para crear dialogos, modales, widgets y todo lo que se te ocurra.

Te dejamos cuatro claves de los popovers:

  • Arriba de todo. Los popovers aparcerán en una capa encima del resto de la página. No tendrás que lidiar con z-index.

  • Clicando fuera sales del popover. Cualquier area fuera del popover será clicable para cerrarlo.

  • Focus en el popover. Cuando abres un popover el resto de cosas se paran.

  • Accesibilidad. Pulsando la tecla esc podrás salir del popover.

¡Ahora podrás crear popovers sin usar JavaScript para hacer todo esto!

Sé que estas deseando verlo en código. Aquí tienes un ejemplo:

<button popovertarget="my-popover">Abrir el popover</button>

<div id="my-popover" popover>
  <p>Hola, soy un popover con información<p>
</div>

Opera ha lanzado un navegador llamado Opera One.

Este incluye un asistente de inteligencia artificial llamado Aria basado en la tecnología GPT de OpenAI.

Aria podrá evolucionar y conectarse a diferentes modelos de IA en el futuro.

Este chatbot se activa desde la barra lateral del navegador y puede responder a cualquier tipo de pregunta.

En cuanto a privacidad, Opera procesa los textos pero no comparte datos del usuario con OpenAI. Los chats se guardan por 30 días y se pueden borrar en cualquier momento.

Adobe entró al arte generativo por IA con Adobe Firefly y ahora va a integrar esta tecnología en Photoshop. En el tweet de abajo tenéis un vídeo donde podéis ver las posiblidades.

Álbum Lo-Fi

Música preparada para escuchar mientras estas programando, estudiando o trabajando:

Recursos interesantes

 Tailwind Elements es una librería de componentes para Tailwind CSS. En esta librería tienes todos los componentes clásicos de Bootstrap pero en Tailwind. Además tienes muchos más. Kiko Palomares tiene un vídeo en su canal que muestra como se usa.

🪩 Mira esta creación de formas de neon rebotando en un canvas de HTML5.

🚀 Javy te permite ejecutar JavaScript en WebAssembly.

⚛️ Un loader con forma de átomo hecho con puro CSS.

👓 Con WebXR puedes desarrollar experiencias de realidad virtual y aumentada directamente en la web.

💚 Inkline es una biblioteca de componentes para Vue.js de alta calidad, accesibles y personalizables.

⚞ No sé que es esto, pero me gusta. Hecho con CSS y JavaScript.

La tecnología hizo posible las grandes poblaciones; ahora las grandes poblaciones hacen que la tecnología sea indispensable

José Krutch

Vídeos destacados

Deja de usar console.log en tu código y aprende a depurar mejor con CodelyTV:

💜 ¡Comentario destacado!

¡Eso es todo por ahora!

Si quieres contarnos algo, dejarnos un comentario, compartir tus ideas o proyectos interesantes, tan sólo tienes que contestar este email o mándanos un DM en Twitter: @CuarzoDev & @kikopalomares.

Gracias por leernos y te esperamos en el próximo correo.

¿Qué te ha parecido el correo de hoy?

Ayúdanos a mejorar con tu opinión.

Login or Subscribe to participate in polls.

¿Te reenviaron este correo? Regístrate aquí para recibirlos directamente

Join the conversation

or to participate.