Monday, November 25, 2013

Print the page using javascript

<!DOCTYPE html>
<html>
<HEAD>
<title>Print the page using javascript</title>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function varitext(){
var printContents = document.getElementById('printtext').innerHTML;
var originalContents = document.body.innerHTML;
document.body.innerHTML = printContents;
window.print();
document.body.innerHTML = originalContents;
}
//  End -->
</script>
<!-- Remove header and footer text in the print page -->
<style>
@media print {
 @page { margin: 0; }
 body { margin: 1.6cm; }
}
.printtext-content{
border:1px solid #000;
padding:10px;
font-weight:bold;
}
.printtext-content .content-title{
text-align: center;
text-decoration: underline;
font-size: 24px;
}
</style>
</HEAD>
<BODY>
<div >
<div id="printtext">
<div class="printtext-content">
<p><div class="content-title">SAYONARA</div></p>
<p>
As a number of you already know that today is my last day @IndiaNIC . It's hard to imagine that I won't be coming here from tomorrow. Things will be different, life won't be the same.
</p>
<p>
Everybody comes office to work , to gain knowledge , to make money  . but it;s the friends and colleagues who give me strength to come everyday at the same place and do the same thing again and again . i made life long friends @IndiaNIC, which is the only thing i cherish about.
</p>
<p>
I want you all to know that I am truly leaving here with mixed feelings; happy about my new career opportunity (really happy), but sad to be leaving such a wonderful friends and colleagues. The last   years as a member of IndiaNIC was the best period of my career so far.
</p>
</div>
</div>
<form>
<INPUT NAME="print" TYPE="button" VALUE="Print this Document!" ONCLICK="varitext()">
</form>
</div>
</html>

Thursday, November 21, 2013

Simple banner rotator with jQuery

 <!DOCTYPE html>
<html>
  <head>
   <!--Included jquery script library-->
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
    <script type="text/javascript">
      $(window).load(function() {
        startRotator("#rotator");
      })
//Initialise rotate js
 function rotateBanners(elem) {
 var active = $(elem+" img.active");
 var next = active.next();
 if (next.length == 0)
next = $(elem+" img:first");
 active.removeClass("active").fadeOut(200);
 next.addClass("active").fadeIn(200);
}

function prepareRotator(elem) {
 $(elem+" img").fadeOut(0);
 $(elem+" img:first").fadeIn(0).addClass("active");
}

function startRotator(elem) {
 prepareRotator(elem);
 setInterval("rotateBanners('"+elem+"')", 2000);
}
</script>
<!-- Initialise rotate css -->
<style>
#rotator img { position: absolute; }
</style>
  </head>
<body>
 <!-- Rotator images -->
  <div id="rotator">
    <img height="154" src="C:\Users\Public\Pictures\Sample Pictures\Autumn Leaves.jpg" width="550" />
    <img height="154" src="C:\Users\Public\Pictures\Sample Pictures\Garden.jpg" width="550" />
    <img height="154" src="C:\Users\Public\Pictures\Sample Pictures\Green Sea Turtle.jpg" width="550" />
    <img height="154" src="C:\Users\Public\Pictures\Sample Pictures\Autumn Leaves.jpg" width="550" />
    <img height="154" src="C:\Users\Public\Pictures\Sample Pictures\Garden.jpg" width="550" />
    <img height="154" src="C:\Users\Public\Pictures\Sample Pictures\Green Sea Turtle.jpg" width="550" />
   
  </div>
</body>
</html>

Wednesday, October 30, 2013

Generate .csv file using PHP

<?php
           // Set label with comma separated
            $str='';
            $str.="tracking_name,origin_zipcode,destination_zipcode,price,customername,orderid,
                       alt_email_id";
            $str .="\n";
          // Set value with comma separated
            $str .="BR76646474RT,5874,2564,150,jaoun brend,ID6353653,admin@admin.com";
            $str .="\n";
            $str .="BR76646474RT,5874,2564,150,jaoun brend,ID6353653,admin@admin.com";
         
          // Set header for download file
            header("Expires: 0");
            header("Cache-control: private");
            header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
            header("Content-Description: File Transfer");
            header("Content-Type: application/vnd.ms-excel");
            header("Content-type: text/x-csv");
            header("Content-Disposition: attachment; filename=rastreamento_detalhado.csv");
            print $str;
            exit;
?>


Tuesday, October 22, 2013

Resize image using PHP

<?php
//  Include the class
include("resize-class.php");
//  1) Initialise / load image
$resizeObj = new resize('sample.jpg');
//  2) Resize image (options: exact, portrait, landscape, auto, crop)
$resizeObj -> resizeImage(200, 200, 'crop');
//  3) Save image
$resizeObj -> saveImage('sample-resized.jpg', 100);
?>

Thursday, October 17, 2013

Upload multiple image in PHP

<html>
<head>
<title>Multi Image Upload</title>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script type="text/javascript">
var i=1;
function fnaddimage(){
if(i<5){
$('#check').before('<div id="addimage"><div class="select-image"><input type="file" name="image[]"></div><input type="button" value="Remove" onclick="fnremoveimage(this)"></div></div>');
i++;
}
}
function fnremoveimage(intI){
$(intI).parent().remove();
i--;
}
</script>
<style>
.select-image{float:left}
</style>
</head>
 <body>
<?php
if(!empty($_POST)){
for($i=0;$i<count($_FILES["image"]["name"]);$i++){
$fileData = pathinfo(basename($_FILES["image"]["name"][$i]));
if($fileData['extension']=='jpg' || $fileData['extension']=='png' || $fileData['extension']=='gif' || $fileData['extension']=='jpeg'){
$target_path = $_SERVER['DOCUMENT_ROOT'].'upload/'.$fileData['basename'];
move_uploaded_file($_FILES["image"]["tmp_name"][$i], $target_path);
}
else
{
echo "There was an error uploading the file {$_FILES['image']['name'][$i]}, please try again!<br />";
}
}
}
?>
<form enctype="multipart/form-data" action="multiimage.php" method="POST">
<div>
<div id="addimage">
<div class="select-image"><input type="file" name="image[]"></div>
<div class="btn-image">
<input type="button" value="Add" onclick="fnaddimage()">
</div>
</div>
<div id="check"></div>
<input type="submit" name="Upload" value="Upload">
</div>
</form>
 </body>
</html>

Tuesday, October 8, 2013

Flash Player Timer

<html>
<head>
<title>Flash Timer</title>
</head>
<body>
 <object align="middle" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" height="180" id="main" width="176">
<param name="allowScriptAccess" value="always" />
<param name="movie" value="http://beta.theonepoint.net/public/images/hquiz/main.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="wmode" value="transparent" />
<param name="FlashVars" value="sec=60&id=2" />
<embed src="http://beta.theonepoint.net/public/images/hquiz/main.swf"
width="176"
height="180"
autostart="false"
quality="high"
bgcolor="#ffffff"
FlashVars="sec=60&id=2"
name="main"
align="middle"
wmode="transparent"
allowScriptAccess="always"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</body>
</html>


Wednesday, October 2, 2013

Get Days,Months,Years,Hours,Minutes and Seconds between Dates in PHP

<?php 

// First Date
$exp_date = date("Y-m-d",strtotime('2013-09-24 16:20:00'));

//Second Date
$del_date = date("Y-m-d",strtotime('2013-09-30 11:54:47'));

$datetime1 = date_create($exp_date);
$datetime2 = date_create($del_date);

$interval = date_diff($datetime1, $datetime2);

//Display all parameters with value
print "<pre>";
print_r($interval);

?>

Tuesday, September 24, 2013

Highcharts "Bar Chart" with download chart image functionality

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
<html debug="true">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery.noConflict();
</script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script type="text/javascript">
(function($){ // encapsulate jQuery
$(function () {
        $('#container').highcharts({
            chart: {
                type: 'column'
            },
            title: {
                text: 'Monthly Average Rainfall'
            },
            subtitle: {
                text: 'Source: WorldClimate.com'
            },
            xAxis: {
                categories: [
                    'Jan',
'Feb',
'Mar',
                   
                ]
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Rainfall (mm)'
                }
            },
            tooltip: {
                headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
                pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                    '<td style="padding:0"><b>{point.y:.1f}</b></td></tr>',
                footerFormat: '</table>',
                shared: true,
                useHTML: true
            },
            plotOptions: {
                column: {
                    pointPadding: 0.2,
                    borderWidth: 0
                }
            },
            series: [{
                name: 'Tokyo',
                data: [49.9, 71.5, 106.4]
   
            }]
        });
    });
   
})(jQuery);
</script>
</head>
<body>
<div id="demo-content">
<div style="margin: 5px">
              <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
</div>
</div>
</body>
</html>

Generate PDF using PHP code

// First Download  "DOMPDF" Library 


//Use this code
<?php

 require_once('/libraries/dompdf/dompdf_config.inc.php');
          $html =
                '<html><body>'.
                '<p>Hello World!</p>'.
                '</body></html>';
         $dompdf = new DOMPDF();
         $dompdf->load_html($html);
         $dompdf->render();
         $dompdf->stream("hello_world.pdf");
?>

Saturday, September 21, 2013

Get .csv file contents using php

$fp = fopen('D:\wamp\www\hmvcExample\img\upload\retest.csv','r') or die("can't open file");
while($csv_line = fgetcsv($fp,1024)) {
    for ($i = 0, $j = count($csv_line); $i < $j; $i++) {
        $csv_line[$i];
    }
$total_data[]=$csv_line;
}
fclose($fp) or die("can't close file");

Tuesday, September 17, 2013

Examples of Jwplayer (audio and video player)

<HTML>
<HEAD>
<TITLE>Jwplayer Player Javascript Kit</TITLE>
<script language='javascript' src='jwplayer.js'></script>
</HEAD>
<BODY>
<div id="mediaplayer_joke_1"></div>
<script type="text/javascript">
 jwplayer('mediaplayer_joke_1').setup({
'flashplayer': 'player.swf',
'width': '300',
'height': '24',
'autostart': 'false',
'file': 'example1.mp3',
'controlbar': 'bottom'
 });
</script>
</BODY>
</HTML>

Wednesday, September 11, 2013

Sticky notes made by css

<html>
<head>
<title>Sticky Note</title>
<style>
.sticky {
 -webkit-box-shadow: #DDD 0px 1px 2px;
 position: fixed;
 background-color: #F4F39E;
 border-color: #DEE184;
 text-align: center;
 margin: 2.5em 0px;
 padding: 1.5em 1em;
 -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.25);
 -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.25);
 box-shadow: 0px 1px 3px rgba(0,0,0,0.25);
 font-family: Chalkboard, 'Comic Sans';
}
.sticky.taped:after {
 display: block;
 content: "";
 position: absolute;
 width: 151px;
 height: 35px;
 top: -21px;
 left: 25%;  
 background: transparent url(tape.png) 0 0 no-repeat;
}
</style>
</head>
<body>
<p class="sticky taped" style="width: 250px;">
 <strong>The Little Turtle</strong>.<br />
 There was a little turtle.<br />
 He lived in a box.<br />
 He swam in a puddle.<br />
 He climbed on the rocks.<br />
 —Vachel Lindsay
</p>
</body>
</html>

Wednesday, August 7, 2013

Change word in given string using Jquery and enter new line in textarea

<html>

<head>

<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>

<script>

var f_name='';

function fnformname(){  

var from_name_val = $("#from_name").val();  

if(from_name_val!=''){   

if(f_name!=''){    

var emailcontent_val_data = $("#emailcontent").val();    

var final_data = emailcontent_val_data.split(f_name).join(from_name_val);    

$("#emailcontent").val(final_data);    

f_name=from_name_val;   

}   

else {    

var emailcontent_val_data = $("#emailcontent").val();    

var final_data = emailcontent_val_data.split('<fromname>').join(from_name_val);    $("#emailcontent").val(final_data);    

f_name=from_name_val;   

}   

return true;  

}

</script>

<head>

<body>

<?php$mail_data = "Hello,\n<fromname> has sent you a link to install the app on your device."?>

<div class="fieldtext-box cf">  

<div class="fieldtext alignleft">    

<label for="email">From Name</label>    

<input type="text" name="from_name" id="from_name" onblur="return fnformname()" />  

</div>  

<div class="fieldtext alignleft">   

<label for="email" class="email-text-label" style="vertical-align:top">Email Text</label>   

<textarea rows="5" cols="40" id="emailcontent" class="email-text" name="emailcontent" ><?php echo $mail_data;?></textarea>  

</div>

</div>

</body>

</html>


Load JS Dynamically

// Load JS Dynamically after click on button

<html>
<head>
<title>Load JS Dynamically</title>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script type="text/javascript">     
function loadjs(){                
var url="newscript.js";                   
$.getScript(url, function() {                         
alert('JS Load Successfully');                   
});         
}</script>
</head>
<body>
<input type="button" name="load" value="Load JS" onclick="loadjs()">
</body>

</html>
Note:Please load js put in your project folder not load any server js directly because of server js take much time for load.  

Spin.js Example

<html>  <head> 
  <title>spin.js</title>
 
  <link rel="shortcut icon" href="favicon.ico">
 
  <link href="http://fgnass.github.io/spin.js/assets/main.css?v=6"    type="text/css"     rel="stylesheet">
 
  <link rel="stylesheet" type="text/css"      href="http://fgnass.github.io/spin.js/assets/fd-slider/fd-slider.css?v=2">
 
<script type="text/javascript" src="http://fgnass.github.io/spin.js/assets/prettify.js"></script>
</head><body>

<div id="content">
   <div id="example">         <h2>Example</h2>
          <div id="preview"></div>

    <form id="opts">
 
 <label>Lines:</label>
<input type="text" name="lines" min="5" max="16" step="2" value="12">  <br> 
 <label>Length:</label>
<input type="text" name="length" min="0" max="40" value="20"><br>
    <label>Width:</label>
<input type="text" name="width" min="2" max="30" value="10"><br>
    <label>Radius:</label>
<input type="text" name="radius" min="0" max="60" value="30"><br>
    <label>Corners:</label>
<input type="text" name="corners" min="0" max="1" step="0.1" value="1"><br>
   
<label>Rotate:</label>
<input type="text" name="rotate" min="0" max="90" value="0"><br>
    <label>Trail:</label>
<input type="text" name="trail" min="10" max="100" value="60"><br>
    <label>Speed:</label>
<input type="text" name="speed" min="0.5" max="2.2" step="0.1" value="1"><br>
   
<label>Direction:</label>
 
 <select name="direction">
 
     <option value="1">Clockwise</option>
      <option value="-1">Counterclockwise</option>  </select>    <br>   
<label>Shadow:</label>
<input type="checkbox" name="shadow"><br>
 
 <label>Hwaccel:</label>
<input type="checkbox" name="hwaccel"><br>
 
</form>
</div><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script><script type="text/javascript" src="http://fgnass.github.io/spin.js/assets/fd-slider/fd-slider.js"></script><script src="http://fgnass.github.io/spin.js/dist/spin.min.js?v=1.2.8"></script><script>  $.fn.spin = function(opts) {   
                        this.each(function() {
   
                           var $this = $(this),
         
                          data = $this.data();
                        if (data.spinner) {       
                               data.spinner.stop();
       
                               delete data.spinner;
     
                       }
     
                      if (opts !== false) {
       
                         data.spinner = new Spinner($.extend({color: $this.css('color')},                                                          opts)).spin(this);
     
                        }
 
               });
   
      return this;
 
};
 
//$('#dot').spin();
 
prettyPrint();

 function update() {
   
        var opts = {};
 
       $('#opts input[min], #opts select').each(function() {
     
          $('#opt-' + this.name).text(opts[this.name] = parseFloat(this.value));
 
     });
   
          $('#opts input:checkbox').each(function() {
   
                 opts[this.name] = this.checked;
     
                $('#opt-' + this.name).text(this.checked);
 
          });
 
         $('#preview').spin(opts);
 
        if ($('#share').is(':checked')) {
   
              window.location.replace('#?' + $('form').serialize());
 
         }

 }
 
$(function() {
   
      var params = {};
 
      var hash = /^#\?(.*)/.exec(location.hash);
 
     if (hash) {
     
        $('#share').prop('checked', true);
   
        $.each(hash[1].split(/&/), function(i, pair) {
       
              var kv = pair.split(/=/);
     
              params[kv[0]] = kv[kv.length-1];
   
        });
 
      }
 
    $('#opts input[min], #opts select').each(function() {
   
           var val = params[this.name];
     
          if (val !== undefined) this.value = val;
   
               this.onchange = update;
    }); 
   $('#opts input:checkbox').each(function() {
   
       this.checked = !!params[this.name];
   
        this.onclick = update;
    });   
    $('#share').click(function() {
     
               window.location.replace(this.checked ? '#?' + $('form').serialize() : '#!');
    });    update();  });</script>

</body></html>

Tuesday, August 6, 2013

Get XML (android:versionCode="1") attributes value using PHP Functionality

// XML File Contents
<?xml version="1.0" encoding="utf-8"?><manifest android:versionCode="1" android:versionName="1.0" package="com.example.myfirstapp"  xmlns:android="http://schemas.android.com/apk/res/android">    <application android:theme="@style/AppTheme" android:label="@string/app_name" android:icon="@drawable/ic_launcher" android:debuggable="true" android:allowBackup="true">        <activity android:label="@string/app_name" android:name="com.example.myfirstapp.MainActivity">            <intent-filter>                <action android:name="android.intent.action.MAIN" />                <category android:name="android.intent.category.LAUNCHER" />            </intent-filter>        </activity>    </application></manifest>


// PHP Code for get (android:versionCode="1") versioncode,(android:versionName="1.0") Versionname and    (package) package value.It's Working only above PHP Version 5.3.8 


<?php 
$dom = new DOMDocument();$dom->load('AndroidManifest.xml');$xml = simplexml_import_dom($dom);$versionName = $xml->xpath('/manifest/@android:versionName');$versionCode =$xml->xpath('/manifest/@android:versionCode');$package = $xml->xpath('/manifest/@package');
echo $versionName[0]->versionName;echo $versionCode[0]->versionCode;echo $package[0]->package;
?>

Get Current location address(country,city) from IP address using API

<?php
// Get current IP address using API
$ip_address = file_get_contents("http://ip6.me/");
// Get IP Address value using this function
$ip_data = explode(".",$ip_address);
$first_ip_element = substr(preg_replace('/[^0-9]/','',$ip_data[0]),-3);
// Get Current location address with Ip address
$f_get = file_get_contents("http://api.hostip.info/get_html.php?ip=".$first_ip_element.'.'.$ip_data[1].'.'.$ip_data[2].'.'.$ip_data[3]);
echo $f_get;
?> 

Monday, July 8, 2013

Get value of inside of "![CDATA" In PHP

If you have XML File and in this file data was stored like this.
"
<tourlist>
<item>
<tourName>
<![CDATA[Milano Card]]>
</tourName>
<tourCity>
<![CDATA[Milan]]>
</tourCity>
<tourCountry>
<![CDATA[Italy]]>
</tourCountry>
<highlights>
<![CDATA[Get all that you need at Milan and discover the heart of Europe from culture art entertainment and cuisine. Choose the service that you want and use your Milano Card for perks and discounts. Get to use public transportation for free for 3 days and gain free access to selected museums!]]>
</highlights>
</item>
</tourlist>
"
And if you want to get this data using PHP script  then execute this code. 

<?php 

  $doc = new DOMDocument();
  $doc->load('http://' . $_SERVER['HTTP_HOST'] . '/citytoursxmlfiles/city.xml' );
   $destinations = $doc->getElementsByTagName("item");
   $simpleXml = array();
   foreach ($destinations as $destination) {
            $simpleXml[] = $destination->nodeValue;
     }
      echo json_encode($simpleXml); 

?>

Get Latitude and Longitude with CIty,State,Country and Postal code of Given address

<html>
<title>Get Current Location</title>
<head>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script language="JavaScript" type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=geometry"></script>
<script type="text/javascript">
 jQuery(function() {
var geocoder = new google.maps.Geocoder();
var add_r="Ahmedabad,India";
     geocoder.geocode( { 'address': add_r}, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    var latitude = results[0].geometry.location.lat();
                    var longitude = results[0].geometry.location.lng();
jQuery('#latitude').text(latitude);
                    jQuery('#longitude').text(longitude);
                    jQuery('#content1').text(results[0].formatted_address);
                    jQuery('#city').text(results[0].address_components[1].long_name);
                    jQuery('#state').text(results[0].address_components[2].long_name);
                    jQuery('#country').text(results[0].address_components[3].long_name);
                    jQuery('#postalcode').text(results[0].address_components[4].long_name);
                } 
            });
});
</script>
<head>
<body>
    <div>
          <div>
                  Latitude =<b id="latitude"></b>
           </div>
   <div>
                  Longitude =<b id="longitude"></b>
           </div>
          <div>
                  City   =<b id="city"></b>
          </div>
 <div>
                  State   =<b id="state"></b>
          </div>
 <div>
                  Country   =<b id="country"></b>
          </div>
          <div>
                  Postal Code   =<b id="postalcode"></b>
          </div>
 <div>
                  Address   =<b id="content1"></b>
          </div>
 
    </div>
</body>
</html>

Get Current City's Temperature using Jquery

<html>
<title>Get Current Location</title>
<head>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script language="JavaScript" type="text/javascript" src="http://j.maxmind.com/app/geoip.js"></script>
<script language="JavaScript" type="text/javascript" src="/js/jquery.simpleWeather-2.2.min.js"></script>
<script type="text/javascript">
 jQuery(function() {
     jQuery.simpleWeather({
                zipcode: '',
                woeid: '2357536',
                location: geoip_city(),
                unit: 'f',
                success: function(weather) {
                        jQuery('.container .location-temp').css('background','url('+weather.thumbnail+') no-repeat 0 2px');
                        jQuery('.container .location-temp').css('padding','5px 0px 0 53px');
                        jQuery('.container .location-temp').html(weather.tempAlt+'&deg;C');
                },
                error: function(error) {
                        jQuery("#weather").html('<p>'+error+'</p>');
                }
        });
});
</script>
<head>
<body>
<div>Get Current City's Temperature Please download "jquery.simpleWeather-2.2.min.js"</div>
    <div class="container">
          <div id="weather">
                  Temperature  : <b class="location-temp"></b>
           </div>
         
    </div>
</body>
</html>

Timer using Jquery

<html>
 <head>
<title>Get Current Location</title>
     <script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script type="text/javascript">
jQuery( document ).ready(function() {    
setInterval(function() {       
offset = '+2';       
d = new Date(jQuery.now());        
utc = d.getTime() + (d.getTimezoneOffset() * 60000);          
nd = new Date(utc + (3600000*offset));       
var currentMinutes = nd.getMinutes ( );       
var currentHours = nd.getHours ( );    
var currentSeconds = nd.getSeconds ( );       
currentHours = ( currentHours < 10 ? "0" : "" ) + currentHours;    currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes; 
currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;
jQuery('.location-time').text(currentHours+":"+currentMinutes+":"+currentSeconds);    }, 1000);});
</script>
<head>
<body> 
<div>It is display "Italy" Time if you want chnage time accroding to your country so please change offset value as per your country.</div>    
<div>   Current Time = <b class="location-time"></b>    </div>
</body>
</html>    

Get current location using API

<html>
<title>Get Current Location</title>
<head>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script language="JavaScript" type="text/javascript" src="http://j.maxmind.com/app/geoip.js"></script>
<script type="text/javascript">
 jQuery(function() {
     jQuery('#country_code').text(geoip_country_code());
     jQuery('#country_name').text(geoip_country_name());
     jQuery('#city').text(geoip_city());
     jQuery('#region_code').text(geoip_region());
     jQuery('#region_name').text(geoip_region_name());
     jQuery('#latitude').text(geoip_latitude());
     jQuery('#longitude').text(geoip_longitude());
});
</script>
<head>
<body>
    <div>
          <div>
                  Country Code=<b id="country_code"></b>
           </div>
         <div>
                  Country Name=<b id="country_name"></b>
           </div>
          <div>
                  City= <b id="city"></b>
           </div>
          <div>
                  Region Code=<b id="region_code"></b>
           </div>
           <div>
                  Region Name:<b id="region_name"></b>
           </div>
          <div>
                  Current Latitude=<b id="latitude"></b>
           </div>
           <div>
                  Current Longitude=<b id="longitude"></b>
           </div>

    </div>
</body>
</html>

Display popup before closing the window or refreshing the page.

<html>
 <head>
  <script src="http://code.jquery.com/jquery-latest.min.js"></script>
  <script type="text/javascript">
   window.onbeforeunload = function() {
    return "You're leaving the site.";
   };
   $(document).ready(function() {
    $('a[rel!=ext]').click(function() { window.onbeforeunload = null; });
    $('form').submit(function() { window.onbeforeunload = null; });
   });
  </script>
  <form name="firstsite">
   <input type="submit" name="submit" value="submit">
  </form>
 </head>
</html>