yensdesign – Tutorials, Web Design and Coding

Daily free tutorials about web design, coding, jquery and more

Posts Tagged ‘css’

Mastering CSS background-position

Thursday, January 22nd, 2009

Hi there guys! As you may know, we have published a lot of tutorials to learn how to improve the interaction of our web applications mainly using javascript and jQuery. We have created our layouts for these tutorials using xHTML and CSS and this time the CSS part will be the important thing and not a simple spectator.

We will learn how to use the CSS property background-position to create different kind of buttons, interfaces and more by using only one image as background. It will reduce the loading time and supress the user’s waiting on mouse over effects.

As always, you can try the living example over here.

Tested in: Firefox, Internet Explorer 6 & 7, Opera, Safari & Chrome.

It will be an interesting (and funny) tutorial, come on guys!

(more…)

Cheat Sheets Pack for Webmasters

Monday, December 22nd, 2008

If you are very forgetful as I am and sometimes when you are “in the flow” and you cann’t remember a javascript function, a CSS property you know, it can be very helpful take your cheat sheet and remember it with a simple glance. You can read your desired cheat sheet in your screen or maybe just print it as a lot of people used to do, with the time you will find it faster and faster because you know the specific area where you must look to find that CSS property that you forgot (remember that visual memory it’s very powerful!).

You can download the Full Cheat sheets pack for Webmasters or download one by one the cheat sheets:

I hope it be useful for those forgetful heads :P

(more…)

How to create a stunning and smooth popup using jQuery

Friday, September 26th, 2008

Nowadays, websites are more and more rich and interactive and users are becoming more and more critical with all things in websites. Using windows popup to show important information are in the air and We are going to learn how to create a stunning and great window popup from the scratch using jQuery in a simple and clean tutorial, the first one of this new blog. Just enjoy it and tell me uf you can not understand something because my english sucks…

You can test the tutorial working overhere.

Tested in: Firefox, Internet Explorer 6 & 7, Opera (old and 9.52) , Safari & Chrome.

(more…)