Argonalyst

Criando diagramas giratórios com HTML e CSS

Argonalyst
21 April 2023

CSS permite criar diagramas giratórios sem a necessidade de usar JavaScript ou formatos de imagens animadas. Esse recurso, que é feito apenas com HTML e CSS, pode ser útil para mostrar informações em um formato visualmente atrativo. É possível criar um cubo giratório com uma letra em cada vértice. Para isso, é necessário criar uma div para cada letra e posicionar com translate3d, mantendo o centro do cubo em x=2em e z=0em. O cubo deve ter 4em de largura e 8em de altura. A animação é feita no CSS, com uma rotação de rotateY(0turn) a rotateY(1turn) em 20 segundos. Para manter as letras sempre visíveis, é necessário criar outra div dentro de cada letra, onde é possível fazer a rotação em sentido oposto ao do cubo. É adicionado ao novo div interno a animação de un-spinning, que é de rotateY(0turn) a rotateY(-1turn). Esse recurso funciona bem em navegadores móveis e é possível até selecionar o texto giratório. É importante ressaltar que o autor do texto utilizou outras técnicas para gerar geometrias em LaTeX, que não foram mencionadas aqui.

Últimos vídeos

Confira os últimos vídeos publicados no canal

Argonalyst

Ex-OpenAI criou uma IA 200x mais rápida que as LLMs

Argonalyst

Opus 5.5 vs GPT-6: Nenhuma IA estava preparada para esse teste

Argonalyst

O Google mapeou o CÉREBRO de uma mosca… e a internet colocou DOOM nele

Argonalyst

De imagens perfeitas a descobertas científicas: IA está mudando de nível

Argonalyst

GPT-6 fez 99,9% neste Teste… Chegamos à AGI?

Argonalyst

O "Algoritmo Mortal" está chegando? IA já pode criar vídeos infinitos

Argonalyst

Anthropic pode se tornar a ÚNICA empresa do mundo, mas a AGI pode impedir isso

Argonalyst

Como Hackers roubaram MILHÕES em Bitcoin explorando um BUG quase invisível

Argonalyst

Os EUA proibiram esses Robôs por medo de espionagem

Argonalyst

O verdadeiro motivo pelo qual querem controlar a IA

Argonalyst

IA da OpenAI escapou do Sandbox? O que REALMENTE aconteceu

Argonalyst

A maior virada da Inteligência Artificial começou... e vem da China

Argonalyst

o ALERTA de Satya Nadella que ASSUSTOU o mercado de IA

Argonalyst

GPT 5.6 SURPREENDE: OpenAI finalmente alcançou a Anthropic?

Argonalyst

Os novos modelos de IA estão decepcionando... e ninguém quer admitir isso