All Projects → Cuberto → svg-distortion-effect-demo

Cuberto / svg-distortion-effect-demo

Licence: other
This example is dedicated to how you can use the SVG Turbulence and Displacement Map filters to create an interesting switching effect for pictures and videos.

Programming Languages

SCSS
7915 projects
javascript
184084 projects - #8 most used programming language
Pug
443 projects

Cuberto SVG Distortion Demo

Frontend dependencies

GSAP (https://greensock.com/gsap/)

Setup demo project

Install

npm install

Start develop server

gulp or gulp serve deploy app and start browsersync server + watchers

File structure

├── /tmp/                       # Temporary served files
└── /src/                       # The source code of the application
    ├── /js/                    # JavaScript source
        └── particles.js        # Library main
    ├── /pug/                   # Pug templates
        └── /_includes/         # Pug partials
    ├── /scss/                  # SCSS styles
        └── particles.scss      # Library additional css
    ├── /static/                # Static files (fonts, images, videos, etc..)
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].