jBox - take our video right on your site

Welcome to jBox - please feel free to use this on your own website..

jBox is a Javascript, that can be embeded on your website.
That way you have all our media accessible from your own site.
Simply copy the code below and embed this where ever oyu want to show our "jBox Video Search".
It is completely ajax based.

Enjoy!

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'></script>
<script type="text/javascript">
/*
    copyright 2010 - simpeligent.ch
*/
jQuery(document).ready(function() {
jQuery('#jBox_js_warning').hide();
jQuery('#jBox_container').fadeIn('slow');
jQuery('#jBox_status').html('idle');
jQuery('#jBox_search_field').bind('keyup', jBox_search);
jQuery('#jBox_search_field').bind('focus', jBox_pre_text);
jQuery('#jBox_search_field').bind('blur', jBox_after_text);
});
var jBox_search = function(e)
{
var term = jQuery('#jBox_search_field').attr("value");
jQuery('#jBox_status').html('searching for: '+tag);
			if(term!='insert search term'&& term!=''&& term!=' ')
			{
			var tag = term.replace(' ','+');
			jQuery('#jBox_result_container').html('please wait...');
						var html = $.ajax({
						      url: "jBox.proxie.php",
						      global: false,
						      type: "GET",
						      data: ({tag : escape(tag)}),
						      dataType: "html",  success: function(html){
						        jQuery('#jBox_status').html('search was succssful: '+tag);
								jQuery('#jBox_result_container').html(html);
					      }});
			}
};
var jBox_pre_text = function(e)
{
var value_now = jQuery('#jBox_search_field').attr("value");
if(value_now=='insert search term')
{
jQuery('#jBox_search_field').attr("value", '');
}
};
var jBox_after_text = function(e)
{
var value_now = jQuery('#jBox_search_field').attr("value");
if(value_now=='')
{
jQuery('#jBox_status').html('idle');
jQuery('#jBox_search_field').attr("value", 'insert search term');
}
};
</script>
<style type="text/css" media="screen">
#jBox_js_warning        { border: 1px solid red; width: 350px !important; background: black; color: red; padding: 20px;    }
#jBox_js_warning a      { color: red;    }
#jBox_container         { border: 1px solid black ;background: black; display: none; width: 350px !important;  color: white;    }
#jBox_search_container  { border: 2px solid white; height: 30px !important; color: white;  margin: 2px; margin-top: 0px; width: 340px !important; }
#jBox_search_container input  { height: 26px !important; color: black; background: silver; font-size: 20px; width: 340px !important;  }
#jBox_container a       { color: white;    }
#jBox_container img     { width: 90px; margin: 4px; border: 1px solid white;    }
#jBox_report_container  { border: 0px solid black; color: white;    }
#jBox_result_container  { border: 2px solid black; background: black; color: white;  margin: -2px;  width: 349px !important;  position: absolute;  z-index:3; }
</style>
<div id="jBox_js_warning" >
<div id="jBox_header" >
<a href="http://music-network.ch/videos/jBox/" target="_blank"><img src="http://music-network.ch/videos/jBox/logo.jpg" style="width: 341px;padding:-2px;" border="0"/></a>
</div>
Please activate Javascript to see <a href="http://music-network.ch/videos/jBox/">jBox</a> in action
</div>
<div id="jBox_container" >
<div id="jBox_header" >
<a href="http://music-network.ch/videos/jBox/" target="_blank"><img src="http://music-network.ch/videos/jBox/logo.jpg" style="width: 341px;padding:-2px;" border="0"/></a>
</div>
<div id="jBox_search_container" >
<input type="text" name="jBox_search_field" id="jBox_search_field" value="insert search term" />
</div>
<div id="jBox_report_container" >
Status: <span id="jBox_status"></span>
</div>
<div id="jBox_result_container" >no search specified
</div>
</div>
<div id="jBox_overlay" >
</div>
<div id="jBox_player_container" >
<div id="jBox_player" ><span id="jBox_player_close_link">close player</span>
<br /><br />
<div id="jBox_player2" >jBox_player
</div>
</div>
</div>

Please activate Javascript to see jBox in action

Status:

TestSite Footer