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…)

Today nobody really questions benefits of using source level debuggers for any language including PHP – debugger is simply a tool, necessity in everyday programmers work. However, it is interesting to note that code validating tools are much less known and it is those tools that are very valuable addition to debuggers in code development.

Traditionally, in compiled languages, certain part of code validation (type checking, checking for non-initialized variables) are usually taken by compiler, but besides compiler there are also external tools used to conduct this task (for example checkstyle for Java). This article deals with use of one of those tools (Codenizer) during development of PHP applications.

(more…)

Hi guys! If you have tested the beta of Plusmusica (it’s a beta, report bugs please!) maybe you have find some tips when you move the mouse over some elements. We will learn how to create them in a very easy way.

We are going to learn how to create our custom jQuery plugin to show tips on mouse over event on our desired elements. We will also be able to customize the appearence of the tip division for each kind of elements in the CSS code and much more.

A real example is worth a thousand words:

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

Tested in: Firefox, Internet Explorer 6 & 7, Opera, Safari & Chrome.
Let’s learn guys!

Quick note: I receive questions about web hosting. I would recommend checking out WHS as they have a wide selection of good hosting providers and articles about the internet. Check it out for more info. Hope this helps!

(more…)

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…)

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…)

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…)