Something I’ve been playing with lately is CSS3, exploring its capabilities to create animations and transitions.
During my research I’ve seen truly jaw-dropping demos and it seems like people is taking advantage of those capabilities to do really cool stuff. I thought I might try something myself, so I ended up doing this simple example of a Rubik’s cube, showing a mix of transitions, perspective, rotations and a pinch of jQuery (to update some of those values).
It is a bit disappointing that some of those capabilities only exist in some browsers, but hopefully one day that will change.
(1) See the demo here
(2) Demo & Code here - Please note I’ve used the “Prefix Free” js which allows you to write CSS not bothering about all the different browser’s prefixes (-moz, -webkit, -o). Really handy!
The minute I first saw Twitter’s Bootstrap I knew I was going to use it continuously. Either for prototyping or building a site in a short period of time, Twitter Bootstrap has an incredible amount of features/plugins that will ensure your website/app will look great under any browser/device.
Using Photoshop, this little work has been inspired by my days at Uni and the snow outside.
I know. I’m exaggerating a bit with that title. However, If you are a jQuery fan (like me) I can assure you it will save you some valuable time and code. Continue reading
I hope this make you smile like it did to me.
I saw this effect in a blog the other day (which unfortunately didn’t save on my bookmarks) but what caught my attention was the way some pieces of content popped up over the page, making a 3D effect.
I believe it was made on Flash and when I saw it I thought “I should try and replicate it using jQuery”…
So I decided to make the “Memory Game” to learn about the basics of canvas:
So, what is canvas? and what you can do with it? Continue reading
So you’re writing some CSS for your website. You are about to “theme” an element, let’s say a DIV, you set a width to it in order to look as you want. Then you add some content inside and most likely you will add some padding (to add some space).
In the CSS “box-model” what will happen is that the width of the element (and the height) will be increased due to the padding applied. If the width was set to 100px and you added 20px padding, the rendered element will measure 140px (100px + 20px padding left + 20px padding right)
Hello everybody! It’s been a while since my last post. Just wanted to share this website, it’s a beautiful portfolio from a very talented friend. I helped her putting the site together but the photos stand out by themselves.
If you like the photos, feel free to share them using the social buttons inside of each gallery or pinning them on Pinterest! Big Thanks!
This is the link: www.rominaamaro.com
If you are interested in the WordPress theme used in the website, check it out here.