chhumsina/youtubeinstantsearch.html

## youtubeinstantsearch.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Youtube Instant Search Jquery Plugin</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="youtube-jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#utubesearch").keyup(function() {
var s_text = $.trim($("#utubesearch").val());
$('#video_loader').YoutubeVideo({
 feedurl:'http://gdata.youtube.com/feeds/api/videos?q='+s_text+'&v=2&format=5&alt=jsonc', // your rss feed url here...
 count:'10', // total no of videos
 height:'100', //video height
 width:'150', //video width
 loadingtext:'fetching videos from youtube' //loading text...
});
});
});

function watermark(inputId,text){
  var inputBox = document.getElementById(inputId);
    if (inputBox.value.length > 0){
      if (inputBox.value == text)
        inputBox.value = '';
    }
    else
      inputBox.value = text;
}
</script>
<style>
#utubesearch { width:98%; height:40px; padding:1px; font-size:18px; }
.ItemTitle{ background: none repeat scroll 0 0 #1e90ff;
    color: #fff;
    margin: 5px;
    padding: 10px;}
</style>
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-49265271-1', 'codeinnovators.blogspot.com');
  ga('send', 'pageview');

</script>

<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
</head>
<body id="home" style='font-family:PT Sans, sans-serif'>
<div style='width:900px;margin:auto; background:none; border:none; color:#000'>

<center><input type="text" id="utubesearch" />
</center>
<div id="video_loader"> </div>

</body>
</html>
	<!DOCTYPE HTML>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<title>Youtube Instant Search Jquery Plugin</title>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="youtube-jquery.js"></script>
	<script type="text/javascript">
	$(document).ready(function() {
	$("#utubesearch").keyup(function() {
	var s_text = $.trim($("#utubesearch").val());
	$('#video_loader').YoutubeVideo({
	feedurl:'http://gdata.youtube.com/feeds/api/videos?q='+s_text+'&v=2&format=5&alt=jsonc', // your rss feed url here...
	count:'10', // total no of videos
	height:'100', //video height
	width:'150', //video width
	loadingtext:'fetching videos from youtube' //loading text...
	});
	});
	});

	function watermark(inputId,text){
	var inputBox = document.getElementById(inputId);
	if (inputBox.value.length > 0){
	if (inputBox.value == text)
	inputBox.value = '';
	}
	else
	inputBox.value = text;
	}
	</script>
	<style>
	#utubesearch { width:98%; height:40px; padding:1px; font-size:18px; }
	.ItemTitle{ background: none repeat scroll 0 0 #1e90ff;
	color: #fff;
	margin: 5px;
	padding: 10px;}
	</style>
	<script>
	(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]\|\|function(){
	(i[r].q=i[r].q\|\|[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
	m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
	})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

	ga('create', 'UA-49265271-1', 'codeinnovators.blogspot.com');
	ga('send', 'pageview');

	</script>

	<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
	</head>
	<body id="home" style='font-family:PT Sans, sans-serif'>
	<div style='width:900px;margin:auto; background:none; border:none; color:#000'>

	<center><input type="text" id="utubesearch" />
	</center>
	<div id="video_loader"> </div>

	</body>
	</html>