yensdesign – Tutorials, Web Design and Coding

About the author

Hi guys, I am Prathap Beschi, PHP programmer from Balyhoo Advertsing, Chennai, India. I like developing ajax websites, jquery plugins. Follow me on TWITTER.

Introduction

This tutorial is an improvement of How to load content via AJAX in jQuery.

We are going to learn how to make safe ajax links – ajax links that work properly though the browser does not support javascript.

I always worry about ajax links; what if the user’s browser is not enabled javascript?! They can’t go further pages.

Already i have developed some ajax websites, so i want to overcome this problem. We can make a ajax website work properly though there is no javascript with a simple trick. I use Jquery for ajax development, so now i explain this with Jquery.

(more…)

Since we started the blog we haven’t stopped publishing tutorials mainly focused in web usability, interfaces and javascript. Specifically, we have been using in most cases the javascript jQuery library.

Today we are honored to interview one of the most responsible for integrating javascript much easier, more powerful and faster on our Web applications, today we are interviewing John Resig, creator of jQuery.

Let’s dive into the interview guys

(more…)

Hi there guys! If you remember we have published a tutorial about How to create a music player interface in jQuery some weeks ago. Some of you have sent me e-mails, posted comments in the tutorial and in our forums asking about how to implement “the music” to the music player interface. And now I am here to show you the basics to acomplish it.

We are going to learn how to Load, Play and Control our MP3 songs and FLV videos to share them with our visitors in our websites by using javascript (some jQuery) and the flash player JW Player.

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

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

Come on with me guys!

(more…)

Last January 14th 2009 was the birthday of our lovely jQuery javascript library, Happy Birthday! Since January 14th 2006 jQuery team were improving more and more the library and yesterday they have released a new version: jQuery 1.3. And as you may suppose it comes with new great features:

• Sizzle: A sizzlin’ hot CSS selector engine.
• Live Events: Event delegation with a jQuery twist.
• jQuery Event Overhaul: Completely rewired to simplify event handling.
• HTML Injection Rewrite: Lightning-fast HTML appending.
• Offset Rewrite: Super-quick position calculation.

So guys, let’s jump into new features, taking a look to some tests performance to see what’s going on with this 1.3 jQuery version and his performance.

(more…)

Hi guys and welcome to a new tutorial of yensdesign.com! Some of you ask us about the possibility of create a tutorial about how to validate forms in server side (using PHP). So i wrote a tutorial about it, adding some interesting features with jQuery:

We are going to learn how to validate your forms using PHP and jQuery in both sides: client side (using javascript with jQuery) and server side (using PHP). It will be interesting to see how to use regular expressions to validate different kind of e-mails, passwords and more.

As always, here you have a preview of what we are going to do:

You can try the living example before continue reading the tutorial. Remember that if you want to try the server side, you need to disable javascript in your web browser!

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

Let’s learn guys!

(more…)

Hi there guys! We continue writting tutorials to try to improve our website’s interface. Search boxes are in the air and in our days they become a very important part of our websites, so it will be interesting if we can do them a little better.

This time we will learn how to improve a little more our sites by adding some additional interactions to our search boxes like autofocus, highlighting, autoreplace default text and more by using jQuery.

As always I show you a preview image linking the final result:

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

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

Let’s learn guys!

(more…)

Continuing with the tutorials about AJAX and jQuery we will create a stunning and dynamic shoutbox based in PHP and AJAX (using jQuery).

We will learn how to create a dynamic ajax based shoutbox with jQuery from scratch. It will be very interesting to know how to use the ajax function of jQuery and how it can be used to insert and recover data from a MySQL database via PHP in a way asynchronous.

Here you have a preview image:

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.

Come on guys, let’s dive into the tutorial!

(more…)

Ey guys! We want to share with you a new tutorial called How to load content via AJAX in jQuery and as you may suppose it will be focused in learn how to load content from other files by using jQuery.

It’s a simple but useful tutorial for those who need to know how to load dynamically some static content in their websites via AJAX. I have decided to write it because Cyanade ( an user from our forums) asks some questions about dynamic content and ajax in their post Integrating jQuery into an app.

Here is a preview image:

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

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

So I hope He and You find it useful!

(more…)

As you may notice we love jQuery over here because in addition to being one of the best javascript libraries on the web It can be extended so easily, from the basic to the advanced features.

In this case We will learn the basic theory about plugins in jQuery and how to create them with 2 real examples: a simple alert plugin & other plugin that will highlight all inputs in a page when them get the focus.

So get ready to learn guys!

(more…)

Finally I found a great, useful & free resource for our jQuery projects via Color Charge, a jQuery Cheatsheet available in printable A4 format:

It will be very useful for those who are very forgetful