Posts

Showing posts with the label java script

How to read query string value with JavaScript?

To read query string value from the current url with javascript you need to add a function in your head or body section. function getQueryStringValue ( key ) { return decodeURIComponent ( window . location . search . replace ( new RegExp ( "^(?:.*[&\\?]" + encodeURIComponent ( key ). replace ( /[\.\+\*]/ g , "\\$&" ) + "(?:\\=([^&]*))?)?.*$" , "i" ), "$1" )); } Then you can alert or console the value of your query string. Like you have this url in your query string www.example.com/word/?key=value now you can get the value of key string like this. console . log ( getQueryStringValue ( "key" )); or you can alert this alert( getQueryStringValue ( "key" ) );

What is WebSockets in HTML5?

WebSockets in HTML5 Web Sockets is a next-generation communication technology for web applications by which you can send or receive data from server like ajax get post method. You have already used like this type of code in jQuery $.post() Or $.get() or $.ajax() etc What these function do? These function used for send and receive data from server to client or client to server. Same as WebSockets works. Syntax: var Socket = new WebSocket(url, [protocal] ); Example: <script type="text/javascript"> function WebSocketCheck() { if("WebSocket" in window) { alert("WebSocket is supported by your Browser!"); // Lets open a web socket var ws = new WebSocket("www.url.com/para"); ws.onopen = function() { // Web Socket is connected now, send data using send() Method ws.send("Message to send server"); alert("Message is sent now."); }; ws.onmessage = function (evt) { var received_msg = evt.data; alert(&

How to start Meteor APP?

Image
First of all you need a platform where you can start a Meteor APP You can use Linux or any other platform. If you will use Windows that you can face lots of technical issue of installation issue. So there is very basic tutorial from where you can easily learn Meteor. Step1: www.nitrous.io open this link and register here and login This site provide already set up meteor environment After login create a box and choose Node.js environment. Now you have box somthing like this. Click on IDE step2: You will see somthing like this On the left hand sidebar you will see the directory related to your app. In the bottom you can run linux command 3. Now you need to run in the console a command which install all remaing parts of meteor app parts install meteor Now you can follow this link for more info www.discovermeteor.com/blog/meteor-nitrous/

How to call a function on mouse scroll wheel via jquery?

How to call a function on mouse scroll wheel via jquery? Simple copy and paste this code and follow the steps. <script> function handle(delta) {         if (delta < 0)         {         functionscrolldown(); // You can change here the function event according to your need on mouse wheel down         }         else         {         functionscrollup(); // You can change here the function event according to your need on mouse wheel up         } }  /** Event handler for mouse wheel event.  */  /* here mouse wheel event stop from the browser */ $(document).on("click", '.fancybox-close', function(e) { // you also need to stop the Mouse wheel function event on a certain evernt of mouse click so you need to change the ".fancybox-close" class accoding to your click button window.removeEventListener('DOMMouseScroll', wheel, false); window.removeEventListener('mousewheel', wheel, false); });  /* here mouse wheel event will start for the

How to checked all checkbox by on click on one checkbox via jquery?

How to checked all checkbox by on click on one checkbox via jquery? download jquery file from http://jquery.com/ and save into your folder. Note: Do not give online path of on your file otherwise this code will not work,  download jquery file form server and save it in your folder Now simple copy and paste this code in your file <script src="yourSiteUrl/js/jquery.min.js"></script> // Change this yourSiteUrl from your site url <script> function markall() { var AllDay = $("#select_all").is(":checked") ? "true" : "false";     if(AllDay=='true')     {         $('.clsNoborder').attr('checked',true);     } else {         $('.clsNoborder').attr('checked',false);     } }; </script> <div> <input type="checkbox" id="select_all" name="select_all" onclick="markall();"/>: check all </div> <div>  <input typ

How to compare two dates via javascript?

How to compare two dates via java-script or how to check two dates that which one is greater and smaller? here is a code where you can check that which date is greater then other or same as vice verse. Simply copy and paste below code in your html file and run the file and change variable according to your need. Note: date format can be in two format one  2012-12-26 00:00:00  or 2012/12/26 00:00:00 Date compare <script> var s_date1 = "2012-12-26 00:00:00"; var en_date1 = "2012-12-26 00:00:00"; var s_date1_new=s_date1.replace(/-/g,"/"); // this line is for if date format is in hyphen like  2013-12-12 00:00:00 var en_date1_new=en_date1.replace(/-/g,"/"); // this line is for if date format is in hyphen like  2013-12-12 00:00:00 var date_ini = new Date(s_date1_new).getTime(); var date_end = new Date(en_date1_new).getTime(); if(isNaN(date_ini)) { alert("Start date format is wrong!"); return false; } if(isNaN(

How to add jQuery email validation in my site?

Image
I want to add jQuery email validation in my site which is good looking also simply copy and paste this code for add jQuery email validation for your site <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("jquery", "1.7.1"); </script> <script type="text/javascript">     $(document).ready(function(){         try {         var domains =['hotmail.co.uk','yahoo.co.uk','yahoo.com.tw','yahoo.com.au','yahoo.com.mx','gmail.com','hotmail.com','yahoo.com','aol.com','comcast.net','msn.com','seznam.cz','sbcglobal.net','live.com','bellsouth.net','hotmail.fr','verizon.net','mail.ru','btinternet.com','cox.net','yahoo.com.br','bigpond.com','att.net',

How to add a text counter in textarea or Setting a maxlength on a textarea?

if you want to add text counter your textarea and set the Setting a maxlength on a textarea. so simply add this code in file and run the file in your browser <form name="textcount" id="textcount"> <textarea cols="60"  rows="12" class="input_compose_textarea" id="description" name="description" onkeypress="textCounter(this,this.form.counter,500);" onblur="textCounter(this,this.form.counter,500);"></textarea> <br/> Max length - <input    type="text" readonly="readonly"    name="counter"    maxlength="3"    size="3"    value="500"    onblur="textCounter(this.form.counter,this,500);"> char remaining. </form> <script type="application/javascript"> function textCounter( field, countfield, maxlimit ) { if ( field.value.length > maxlimit ) { field.value = field.va

How to add slide out div in our website?

How to add slide out div in our website? <style type="text/css" media="screen">     .slide-out-div {        padding: 20px;         width: 250px;         background: #f2f2f2;         border: #29216d 2px solid;     }     </style>     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>            <script> /*     tabSlideOUt v1.3         By William Paoli: http://wpaoli.building58.com     To use you must have an image ready to go as your tab     Make sure to pass in at minimum the path to the image and its dimensions:         example:             $('.slide-out-div').tabSlideOut({                 tabHandle: '.handle',                         //class of the element that will be your tab -doesnt have to be an anchor                 pathToTabImage: 'images/contact_tab.gif',     //relative path to the image for the tab *

How to use Number Validation for text box onkeyup by javascript?

How to use Number Validation for text box onkeyup by javascript? i got stuck in this problem so i make some customize code of Number Validation for text box onkeyup by javascript. it runs good and give quick alert. you can copy and paste this code in your file and simply run the file and you can customize the code according to your need. <script type="text/javascript"> function checknum(s) { return (s.toString().search(/^-?[0-9.]+$/) == 0 ) } </script>  <input name="phone" id="phone" type="text" class="last_bg" onkeyup="if(this.value != '' &amp;&amp; !checknum(this.value)){this.value = ''; alert('Please enter numbers only!')}"  value=""/> Dont forget to add jquery.js file in this page

How to create or add cookie value by javascript?

<script type="text/javascript"> function setCookie(c_name,value,exdays) { var exdate=new Date(); exdate.setDate(exdate.getDate() + exdays); var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString()); document.cookie=c_name + "=" + c_value; } call this function to create cookie  like below setCookie("cookie_name",value,365); if you dont want delete a cookie after a several time then place 0 zero on exdays(356) </script>

How to overlap or overlay youtube video with html or How do I fix a YouTube flash video in iframe overlay problem on a ajax popup

How do I fix a YouTube flash video in iframe overlay problem on a ajax popup If you want to overlap or overlay youtube video with you html content or pop up And you having the problem that your pop up or html comes under the youtube video in your website and u had already tried too much code and all the unless so try this definitely this work Please follow the instruction it will definitely works four you... simple copy and paste this code in your header or top of iframe <script type="text/javascript"> $(document).ready(function() { $("iframe").each(function(){ var ifr_source = $(this).attr('src'); var wmode = "wmode=opaque"; if(ifr_source.indexOf('?') != -1) { var getQString = ifr_source.split('?'); var oldString = getQString[1]; var newString = getQString[0]; $(this).attr('src',newString+'?'+wmode+'&'+oldString); } else $(this).attr('src',ifr_source+'?'+wmode

How to check all chackbox onclick function via javascript

How to check all chackbox onclick function via javascript <script type="application/javascript"> function checkAllbox(array_with_id_values) {     for (var i = 0, ilen = array_with_id_values.length; i < ilen; i++)     {         document.getElementById(array_with_id_values[i]).checked = true;     } } </script> <a href="javascript:void(0)" onClick="checkAllbox(['a1','a2','a3'])">select all</a> Where a1,a2,a3 are different id checkbox

how to validate image extention by javascript?

function validate() {     var filename = document.getElementById("pimage").value;            if(filename!='')         {         var ext = getExt(filename);         if(ext == "jpg" || ext == "jpeg" || ext == "gif" || ext == "png" || ext == "")         return true;         alert("Please upload image files only.");         return false;         }     }        function getExt(filename)     {         var dot_pos = filename.lastIndexOf(".");         if(dot_pos == -1)             return "";         return filename.substr(dot_pos+1).toLowerCase();     } }

How to call 2 javascript functions on a single html button click?

<input type="button" id="next" name="next" value="Next" onClick="javascript:if(formcheck()) secondblock()"> Note=>which function you want to call first write the name of that function at first position;

JavaScript tabifier, tabbed change on button click

Image
Automatically create an HTML tab interface using JavaScript. In this code you will change the data dynamically in tabbing. Simply copy this code and paste on your html page. <script language="javascript"> function firstblock() {     var ele = document.getElementById("1stblock");             document.getElementById("firsttab").style.backgroundColor="red";         document.getElementById("secondtab").style.backgroundColor="black";         document.getElementById("thirdtab").style.backgroundColor="black";         document.getElementById("2ndblock").style.display="none";         document.getElementById("3rdblock").style.display="none";         document.getElementById("1stblock").style.display="block";         } function secondblock() {     var ele = document.getElementById("2ndblock");     if(ele.style.display