Work
Contact
Work
Contact
Fumio Nonaka
CSS3 animation examples
CSS3 transition and animation with no JavaScript code.
CSS3: Hover Animation with SVG
This example is created based on "
3D cubes built and animated with CSS
", and revises, simplifies its HTML and CSS code. No JavaScript code is used to it.
CSS3: 3D Cubes
This example is created based on "
switch
", and revises, simplifies its HTML and CSS code. No JavaScript code is used to it.
CSS3: Toggle Switch
This example is created based on "
Image Accordion with CSS3
", and revises, simplifies its HTML and CSS code. No JavaScript code is used to it.
CSS3: Image Accordion
CSS3: Hop over notification badge
This example is created based on "
Navigation Bar by Jan Kaděra
", and simplifies its CSS code. No JavaScript code is used to it.
CSS3: 3D style navigation bar
This example is created based on "
Smooth Pulse
", and simplifys its CSS code. No JavaScript code is used to it.
CSS3: Smooth Pulse
This code reconstructs and considerably simlifies "
Sliding Image Panels with CSS3
". No JavaScript code is used to it.
CSS3: Sliding image panels
Toggle a animated hamburger menu with icons using pure CSS animation (no JavaScript).
This example is created based on "
CSS Gooey Menu
", and simplifys its CSS code. Its SVG filter part is excluded. No JavaScript code is used to it.
CSS3: Hamburger menu
This code reconstructs and simlifies "
CSS Cube Flip
". No JavaScript code is used to it.
CSS3: Cube Flip
Spinning button animation on mouse over.
This example is created based on "
Button Spinner Test
", and simplifies its CSS code. No JavaScript code is used to it.
CSS3: Button Spinner
Turning on and off the lamp by the button.
This example is created based on "
lamp
" and "
CSS3 Checkbox Styles
", and simplifys their CSS code. No JavaScript code is used to them.
CSS3: Lamp with switch
Tabs rotate vertically content containing images.
This example is created based on "
3D Cube for tabbed content
", and simplifies its CSS code. No JavaScript code is used to them.
CSS3: 3D Cube for tabbed content
CSS3: Puls effect of a button
Mouse hover stops rotation of photos.
These examples are created based on "
Photos on a rotating polygon
", and simplify its HTML and CSS codes. No JavaScript code is used to them.
CSS3: Photos on a rotating polygon in 3D space
These examples are created based on "
Inspiration for Text Styles and Hover Effects
", and simplify its HTML and CSS codes. No JavaScript code is used to them.
CSS3: Text styles and hover effects
This code reconstructs and simplifies "
Animated Buttons
". No JavaScript code is used to it.
CSS3: Animatied buttons
CSS3: Hover effect of an image and a caption
This code reconstructs and simlifies "
Blurry Menu
". No JavaScript code is used to it.
CSS3: Blurry menu
CSS3: Accordion menu by rollover
You may also like
Other JavaScript libraries code examples
2018
CreateJS code examples
2023
CreateJS, Away3D and other HTML5 code samples
2014
3D libraries code examples
2017
↑
Back to Top