This tutorial will show how simple it is to achieve simple animation mouse hover using CSS3. We use transitions and animations css properties to achieve some of the interactive animation. 1. Simple image popup effect using pure CSS3 *{margin:0;padding:0;} body{margin-top:80px;font-size:12px;font-family:arial,sans-serif;color:#9C9C91;background:#fff;} a {color:#333;text-decoration: none;} a:hover {color:#f00;} .wrap {width:720px;background:#f2f2f2;margin:0 auto;} ul.works {list-style:none;margin:0;padding:0;} ul.works li {float:left;display: inline;margin:0 20px… Continue reading Icon mouse hover effect using CSS3
Day: August 8, 2013
Bootstrap Happiness: 10 Premium Responsive HTML5/CSS3 Templates For ONE Dollar Each
You know that we love Bootstrap here at Noupe. Released in August of 2011, even Twitter may not have known how big it would get. As of Summer 2013, it is still the most popular GitHub development project with over 52k stars and over 16k forks. Building a responsive website based on Bootstrap takes a… Continue reading Bootstrap Happiness: 10 Premium Responsive HTML5/CSS3 Templates For ONE Dollar Each
How To Build a Range Slider Input with jQuery UI
Looking at the HTML5 range input element you can see a number of advancements. Forms are able to take in restricted information from users sliding between number segments. But unfortunately these HTML5 inputs are only supported in modern browsers. So although there are a few limitations we can try to work around them. I want… Continue reading How To Build a Range Slider Input with jQuery UI
10 Useful Resources of HTML5 and CSS3 Generators
HTML5 and CSS3 are two great languages to code a website. Here in this article I provide some great resources of tools which generate the HTML5 and CSS3 code smoothly and you can learn a lot from these resources. CSS3.me CSS3 Gradient Generator CSS3 Previews CSS3 Maker CSS3 Cheat Sheet (PDF) CSS3 Color Names… Continue reading 10 Useful Resources of HTML5 and CSS3 Generators