Posts marked with "jQuery" in categories

How To Change The Browser URL Without Refreshing Page – HTML5

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]

Create Your Own URL Shortening Service Using PHP & jQuery

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]

Uploading An Image Using AJAX In jQuery With PHP

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 :... [READ MORE]

Scroll Horizontally Without Scrollbar Using jQuery

To scroll horizontally with CSS is very annoying, because the whole page will move vertically and sometimes the Y axis will scroll. So I decided to use jQuery and it’s very simple. Only 237 characters which is only 2 lines. Here is the jQuery code with the div id #scrollho. jQuery $('#scrollho').on('mousewheel',function(e){ e.preventDefault(); scrollLeft=$('#scrollho').scrollLeft(); if(e.originalEvent.wheelDeltaY.toString().slice(0,1)=='-'){ $('#scrollho').scrollLeft(scrollLeft+100); }else{ $('#scrollho').scrollLeft(scrollLeft-100); } }); CSS #scrollho{ overflow:hidden; } Explanation The #scrollho div’s scrollbars are hidden with CSS.... [READ MORE]

How to check if the mouse is over an element in jQuery?

Here is a simple plugin to check if the mouse is over an element in JQuery. Open your jQuery source file and search for window.jQuery = window.$ = jQuery;  Paste the code shown below after the code you have just found. <span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;"> $</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">.</span><span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">mlp </span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">=</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">{</span><span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">x</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">:</span><span class="lit" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">0</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">,</span><span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">y</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">:</span><span class="lit" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">0</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">};</span><span class="kwd" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">function</span><span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;"> documentHandler</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">(){</span><span class="kwd" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">var</span><span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;"> $current </span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">=</span><span class="kwd" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">this</span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">===</span><span class="pln" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;"> document </span><span class="pun" style="border: 0px; margin: 0px; padding: 0px; vertical-align: baseline;">?... [READ MORE]

jQuery .live function removed in V 1.9. What is the best replacement for .live function ?

As of jQuery version 1.9, the .live function has been removed which means it is no longer available to use. Instead of this function you can use .on function which also has the same function as .live.  Both of them attach an event handler for all elements which match the current selector, now and in the future. Since .live has been removed you can use .on function. Here’s how we should do it. Replace .live function with .... [READ MORE]

Jquery ExtAjax Plugin V 1.2: Submit forms to external files with preview using Jquery

If you don’t know what this plugin will do then visit the page of the previous version here. The last version of Jquery ExtAjax plugin didn’t have preview feature. But in this version it have a preview feature. The latest version is V 1.2 What’s New in this version Faster Preview feature.  What should I do after downloading. <div> <span style="color: #333333;"><span style="line-height: 16px;">After downloading upload "<b>extajax.... [READ MORE]

How to alert user that he is the ___th visitor of blogger/blogspot blog?

If you ever visited my blog on the day it’s reaching a big view (24000 , 25000) you will get a javascript alert saying you are the 24000th visitor like this : The above image shows that the blog alerted when the user was the 23000 visitor. It will also change the background to this. Want to have this feature on your blog ??? You are in the right place.... [READ MORE]

Selecting a particular parent in Jquery

If you want to select a particular parent div. Then you should use parents() function. If you use parent() function It won’t work. For Example: index.html        This is the a tag!!     If you want to get the id of the main parent which is .main then you should use Jquery code like this: $("#click").live(‘click’, function(){ alert($(this).parents(".main").attr(‘id’)); }); The code above will alert the id of the main parent.... [READ MORE]

Adding Scroll To Top function in Blogger/Blogspot using Jquery

This Post will help you to add a Scroll To Top function in your Blogger Blog. Follow the steps given below. DEMO 1 – Go to Blogger -> Template -> Edit HTML  2 – Adding Codes. Add this script before if you haven’t added a script src of Jquery Library. Add this Code before tag. $(document).ready(function(){$("body").append("Back to Top "); $("#back-top").hide(); $(function () {$(window).... [READ MORE]

Subscribe

Email :




Subscribe To All

Donate

If you found something helpful, please consider a donation to support this site and projects :)

Donate

Subdomains

DemosLab

Past

This blog was once on WordPress. Now a static site. See source code on

GitLab