A
Anonymous

Permission Section - Copy this React, Tailwind Component to your project

"Crie um componente em React que implemente a funcionalidade de rolagem para exibir uma sequência de imagens (frames) de forma semelhante ao elemento <div class="scrollMotion-wrapper"> encontrado no site da PlayStation. O componente deve: Exibir uma imagem correspondente ao índice atual com base na rolagem do mouse. Impedir a rolagem normal da página enquanto o scroll é utilizado para passar pelas imagens, mas permitir que a rolagem normal seja habilitada novamente ao atingir o último frame. Reiniciar a contagem dos frames quando o usuário voltar para o topo da tela, permitindo que a rolagem inverta a direção e passe dos frames do último para o primeiro. Utilizar um elemento <canvas> para renderizar as imagens de maneira eficiente. Implementar um fator de escala que controle a velocidade de rolagem para cada frame. Incluir uma funcionalidade de acessibilidade que permita ao usuário desativar o movimento de rolagem. Garantir que as imagens sejam carregadas dinamicamente com base na quantidade total de frames. As imagens devem ser carregadas a partir de URLs dinâmicas, onde o índice da imagem pode ser formatado como 'ezgif-frame-IMAGE_INDEX'. Certifique-se de que o componente é responsivo e se adapta ao tamanho da tela."

Prompt
Component Preview

About

PermissionSection - A clear interface for requesting microphone and camera access, ensuring user data transparency for enhanced speec. Free code available!

Share

Last updated 1 month ago