The default select elements looks ugly and if you want to create beautiful sites, its better to not use select element. But what if you really want to use select element ? The only way to accomplish this is to create a dynamic select box which functions just like the HTML select element. In this post I’m going to show you the way to create a fake select box that will open when clicked and when the user selects an option, the select box will automatically close.... [READ MORE]

As you may know, jQuery removed .live() function and instead they told to use .on() function. But I didn’t like this because .on() needs up more parameters than .live() and to handle a click function you have to add an event to the document, instead of the element. A normal live click event code is like this $("#element").live("click",function(){ dosomething(); }); When using .on() to do the same task, the code will be like this :... [READ MORE]

This is the first post I am creating related to the Open project. This trick is used for posting posts and making that post appear at the first of the post feed. This tutorial will guide you on how to execute JavaScript code which is in the response of AJAX call. We are going to use **jQuery **for both AJAX handling. This is the AJAX response : <script>alert("Hello Subin");</script> With a plain AJAX response, the code won’t execute.... [READ MORE]

If you are running an app on the web that requires Internet Connection all the time, sometimes the internet connection will fail on the client side and your app won’t properly work. The best example is the New Tab Chrome Apps that will display the URL icons grayscale when offline and will make the icons back to color when online. To check whether the client’s internet connection is online, we use jQuery.... [READ MORE]

There are certain laws on the Web. One of them is the COPPA law which clarifies the minimum age of a user to signup for a site. The minimum age is 13. If any site allows users under 13 to signup, it is considered illegal. So it’s necessary to add a birthday field in site’s Sign-Up form. So I’m going to tell you how to add a simple, stylish birthday field to your Sign-Up form.... [READ MORE]

A lot of new hacking methods are coming day by day. So it’s the programmers duty to make their user’s password secure. Here is a simple Password Strength Checker created using jQuery. The code contain a function got from WordPress (I modified it) which is the core component of the checker. This checker will check the following on the password : Have minimum value of 4 characters. Whether the username matches with password Whether the password contain small a-z characters and capital A-Z characters.... [READ MORE]

There are a lot of HTML editing services in the Web. Some of the popular services are JsFiddle and JsBin. These sites offer saving function to your account too. If you want to create a site like JSFiddle, then you are at the right place. I’m going to tell you how to create a basic HTML editing software using jQuery. The editor we’re going to create also has a live preview service which means that the user don’t have to submit the code form every time.... [READ MORE]

This post was suggested by Sumit Kumar Pradhan. I recently saw many questions like this on Stack Overflow. Let me start explaining, there is already a function in JavaScript to do this special task. The function is window.history.replaceState. It’s a simple function that needs 3 values. This is actually a HTML5 function that came out on July 2012 (I think). All the latest browsers support the new function except IE 9. Download Demo Here is a small example of the usage of window.... [READ MORE]

I made a URL shortening service a year back using PHP & jQuery. It was pretty simple. You should know the concept of URL Shortening. The concept is simple. When a user sends a request to short a URL, PHP will check if the URL is valid. If it’s valid then PHP will make a string of 5 or 6 characters. A folder is created with the name of this string and an index.php file with header function code is created in this folder.... [READ MORE]

As you know AJAX is the method of sending data without refreshing the page. Now I’m going to tell you how to upload images using AJAX in jQuery. For This You need to Download the jquery.form plugin from here. The Minimum requirement for this plugin is jQuery version 1.5 or later. Download Demo A Sample of uploading image using AJAX in jQuery is shown below : <div> Now Let&#8217;s start on the code.... [READ MORE]