yensdesign – Tutorials, Web Design and Coding

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

Posts Tagged ‘os’

Creating an OS Web Interface in jQuery (Part I)

Tuesday, December 16th, 2008

Finally here you have the First Part of this series of tutorials to recreate an OS Web Interface with our lovely jQuery javascript library.

As you could see in the preview of this tutorial we will focus to create the drag & drop interaction, the double click on icons and a basic taskbar with a start disabled button and a real clock of the system.

As always, here you have a preview of the final result:

It will be very interesting how we can achieve all our goals without using thir party plugins etc.

You can try the living example before continue reading the tutorial.

Tested in: Firefox, Internet Explorer 6 (bad display of PNG icons, IE bug) & 7, Opera, Safari & Chrome.

So let’s go guys!


Preview: Creating an OS Web Interface in jQuery (Part I)

Friday, December 12th, 2008

Hi there guys! Since some of you are asking about the next big tutorial, here you have a brief of the first part of the tutorial in a video:

As you can see, it’s about creating (one more time) interfaces in javascript, this time we will try to recreate an operation web system from scratch without third party plugins as UI jQuery or the draggable.js.

We will release the first part tutorial this Monday, so stay tuned! :)