Tag Archives: animation effects

Simple CSS Button Hover Effect

By | December 25, 2018

Simple CSS Button Hover Effect. Simple, but good looking :hover and :active transition for buttons and links styled as buttons. Tutorial/codes – Demo Author: Andréas Lundgren Created: JUNE 01, 2016 Made with: HTML, CSS and JavaScript

CSS Letter Bouncing Animation Text effect

By | October 27, 2018

This tutorial will show how to make CSS text bouncing effect with Animation using HTML, CSS and JavaScript. You have use this concept when new page loaded. When you have use this concept your website looks like very awesome. Text with individually bouncing letters using CSS animations, plus a little bit of JavaScript to apply the animation at… Read More »

Really clever CSS napkin animation waves effects

By | October 24, 2018

Really clever napkin animation waves effects with element Scalling using only CSS and HTML. Demo and download available. Demo Download Author Indrek Paas Created SEPTEMBER 20, 2018 License Open Compatible browsers Chrome, Firefox, Safari HTML Snippet <div> <div class=”row”> <div class=”column”></div> <div class=”column”></div> <div class=”column”></div> <div class=”column”></div> <div class=”column”></div> <div class=”column”></div> <div class=”column”></div> <div class=”column”></div> <div class=”column”></div> <div… Read More »

Angled Youtube Embed with animation effect when hover

By | October 10, 2018

Angled Youtube Embed with animation effect when hover developed using css, html and javascript. Demo and download available. Demo Download Author Russ Pate Created JULY 10, 2018 License Open Compatible browsers Chrome, Firefox, Safari HTML Snippet <div class=”vh-100 flex justify-center items-center vh-100″> <div id=”vidWrapper” class=”vid isAngled”> <div id=”ytplayer” class=”vid-wrap”></div> </div> </div> CSS Code .vid { transition: .5s all;… Read More »

Image Slider with clip-path animation

By | October 7, 2018

Cool slider animation with clip-path. Image slide show animation developed using CSS, HTML and JavaScript. Demo and Download options are available. Demo Download Author Uwe Chardon Created SEPTEMBER 16, 2018 License Open Compatible browsers Chrome, Firefox, Safari HTML Snippet <div class=”slider” data-state=”0″> <svg id=”prev” viewBox=’0 0 100 100′> <circle cx=”50″ cy=”50″ r=”85″ /> <path d=”M 65,2 17,50 65,98″… Read More »