The incredible effect of rain of letters in the style of the Matrix trilogy.

Overview

O Efeito Matrix

Logo

O incrível efeito da chuva de letras no estilo da trilogia Matrix.

JefersonLuckas License GitHub language count GitHub top language GitHub repo size GitHub contributors GitHub stars GitHub forks

efeito matrix

"Cedo ou tarde, você vai aprender, assim como eu aprendi, que existe uma diferença entre CONHECER o caminho e TRILHAR o caminho"

Morpheus

Traduções

Começando

Essas instruções fornecerão uma cópia do projeto em execução na sua máquina local.

Instalando

Siga passo a passo as seguinte formas de obter o código na sua máquina local.

Clonando o repositório

Para clonar o esse repositório na sua máquina local, utilize as linhas de comando:

#Clonar com SSH

mkdir the-matrix-effect
cd the-matrix-effect
git init
git clone [email protected]:JefersonLucas/the-matrix-effect.git
#Clonar com HTTPS

mkdir the-matrix-effect
cd the-matrix-effect
git init
git clone https://github.com/JefersonLucas/the-matrix-effect.git

Baixando o repositório

Você também pode baixar o repositório em formato zip.

Ambiente

Veja aqui o a página do projeto implantado por @github-pages ver implantação.

Contribuindo

Leia o CONTRIBUTING.md para obter detalhes sobre nosso código de conduta e o processo para enviar solicitações pull para nós.

Versionamento

Usamos o SemVer para controle de versão. Para as versões disponíveis, consulte as tags nesse repositório.

Autores

Veja também a lista completa de contribuidores que participaram deste projeto.

Licença

Este projeto está licenciado sob a licença MIT - consulte o arquivo LICENSE.md para obter detalhes.

Agradecimentos

Meus sinceros agradecimentos:

  • A Deus.
  • Contribuintes do projeto.
  • Todos que visitam o projeto e deixa uma estrela como reconhecimento.
  • Trilogia Matrix com o fodástico Keanu Reeves.
  • Ao Sylvain Saurel, sem o seu trabalho, não me inspiraria a realizaria esse projeto.
You might also like...

A motion hover effect for a background grid of images.

A motion hover effect for a background grid of images.

Image Grid Motion Effect A motion hover effect for a background grid of images. Article on Codrops Demo Installation Install dependencies: npm install

Dec 31, 2022

fixed-background-effect

Fixed Background Effect A simple template that takes advantage of the background-attachment CSS property to create a fixed background effect. Article

Oct 28, 2022

Warp drive is a lightweight jQuery plugin that helps you create a cool, interactive, configurable, HTML5 canvas based warp drive/starfield effect.

Warp drive is a lightweight jQuery plugin that helps you create a cool, interactive, configurable, HTML5 canvas based warp drive/starfield effect.

Warp drive jQuery plugin (jquery-warpdrive-plugin) Preview Description Warp drive is a lightweight jQuery plugin that helps you create a cool, interac

Nov 15, 2022

A mouse particle effect react component

A mouse particle effect react component

react-mouse-particles A mouse particle effect react component A very fun react library that can be used to create mouse particle effects, which are as

Dec 17, 2022

Demos for the tutorial on how to achieve an interactive mouseover/hover effect

Demos for the tutorial on how to achieve an interactive mouseover/hover effect

Interactive Hover Effects with Three.js A simple tutorial on how to achieve an interactive mouseover/hover effect on images in some easy steps. Articl

Dec 27, 2022

:tada: Add a cute click effect to your mouse in your vuepress!

vuepress-plugin-cursor-effects 🎉 Add a cute click effect to your mouse in your vuepress! Document: moefy-vuepress LiveDemo: notev Install yarn add vu

Sep 25, 2022

magneticHover lets you trigger hover effect on the element when the cursor is near it, but not over it yet

magneticHover lets you trigger hover effect on the element when the cursor is near it, but not over it yet

magneticHover magneticHover lets you trigger hover effect on the element when the cursor is near it, but not over it yet. Examples https://codesandbox

Nov 30, 2022

👓 Parallax tilt hover effect for React JS - tilt.js

👓   Parallax tilt hover effect for React JS - tilt.js

React.js - Tilt.js React version of tilt.js Demo https://vx-demo.now.sh/gallery Install yarn: yarn add react-tilt npm: npm install --save react-tilt U

Dec 23, 2022

Simple jQuery plugin for 3d Hover effect

jQuery Hover3d jQuery Hover3d is a simple hover script for creating 3d hover effect. It was my experiment on exploring CSS3 3d transform back in 2015

Jan 4, 2023
Comments
  • Pequenas alterações no CSS e no JavaScript;

    Pequenas alterações no CSS e no JavaScript;

    • Resetando css e preenchendo a tela inteira com o efeito matrix.
    • Mudando a invocação da função 'carregar' de dentro do html para dentro do javascript, sendo chamada assim que o DOM estiver carregado.
    opened by mannoeu 1
  • Suggestion Background issue

    Suggestion Background issue

    Hi Jeferson, I have a suggestion about this effect I think is better to add this line to CSS

    #canvas { position: fixed;}

    and you need to correct this

    *{margin:0;padding:0;box-sizing:border-box}canvas{display:flex;margin:0 auto;width:100%;height:100vh}

    with this

    *{margin:0;padding:0;box-sizing:border-box}canvas{display:flex;margin:0 auto;width:100%;height:100%}

    opened by EleonoraCarrano 2
Owner
Jeferson Lucas
Analista e Desenvolvedor Front-end
Jeferson Lucas
Codrops 135 Dec 12, 2022
Some experimental rain and water drop effects in different scenarios using WebGL, by Lucas Bebber.

Rain & Water Effect Experiments Some experimental rain and water drop effects in different scenarios using WebGL, by Lucas Bebber. Article on Codrops

Codrops 1.4k Jan 4, 2023
A subtle tilt effect for images. The idea is to move and rotate semi-transparent copies with the same background image in order to create a subtle motion or depth effect.

Image Tilt Effect A subtle tilt effect for images. The idea is to move and rotate semi-transparent copies with the same background image in order to c

Codrops 571 Nov 21, 2022
Liquideffect - Javascript Library for creating liquid effect on image and RGB effect on mouse direction.

LiquidEffect Javascript Library for creating liquid effect on image and RGB effect on mouse direction. Demo https://liquideffect.netlify.app/ Dependen

Rohail 8 May 6, 2022
An old-school arcade-style 3D shoot-em-up rendered entirely with CSS 3D transforms

CSS Space Shooter Play The Game This is an experiment I made to investigate the capabilities of CSS 3D transforms. Having played about with this techn

Michael Bromley 162 Oct 2, 2022
Add a water ripple effect to your background using WebGL.

jQuery Ripples Plugin By the powers of WebGL, add a layer of water to your HTML elements which will ripple by cursor interaction! Important: this plug

Pim Schreurs 976 Dec 30, 2022
A decorative website background effect where SVG shapes morph and transform on scroll.

Morphing Background Shapes A decorative website background effect where SVG shapes morph and transform on scroll. Article on Codrops Demo This demo is

Codrops 351 Dec 26, 2022
Background image segment effect as seen on [Filippo Bello's Portfolio](http://www.filippobello.com/portfolio).

Segment Effect Background image segment effect as seen on Filippo Bello's Portfolio. Article on Codrops Demo License Integrate or build upon it for fr

Codrops 526 Nov 29, 2022
Switch the background-image with using effect.

jQuery.BgSwitcher Switch the background image with using effect. Demo http://rewish.github.io/jquery-bgswitcher/ Usage <div class="box"> <p>Lorem ip

rewish 195 Dec 30, 2022
Recreation of the background scale hover effect seen on the DDD Hotel website using CSS clip paths.

Background Scale Hover Effect Recreation of the background scale hover effect seen on the DDD Hotel menu using CSS clip paths. Article on Codrops Demo

Codrops 98 Dec 6, 2022