PK

ADDRLIN : /home/anibklip/msbhogalnsons.com/
FLL :
Current File : /home/anibklip/msbhogalnsons.com/tree.html

<!-- <script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.0.47/jquery.fancybox.min.js"></script>
 -->


<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {

	$( document ).tooltip(); // initialize tooltip

  

	var id='';
	//$( document ).tooltip();
	$(".tooltip").tooltip({
		track:true,
		content: function() {
			id= $(this).attr("href");
			//alert(id);
			//return id;
			return "<img src='http://farandwide.much.com/wp-content/themes/faw-v2.2.27/dist/images/login/loading-sm.gif'>";
		},open: function( event, ui ) {
			var id = this.id;
			var split_id = id.split('_');
			var userid = split_id[1];
			//alert("s"+userid);
			$.ajax({
				url:'tree.php?n='+userid,
				type:'post',
				data:{userid:userid},
				success: function(response){
					// Setting content option
					$("#"+id).tooltip('option','content',response);
				}
			});
		}

		/*track: true,
		//content: '... waiting on ajax ...',
		content: function() {
			id= $(this).attr("href");
			//alert(id);
			return id;
		},
		open: function(evt, ui) {
			var elem = $(this);
			//alert(elem.attr("title"));
			//alert(elem.toSource());
			$.ajax({
				url:'tree.php?n='+id,
				success: function(result){
					//alert(result);
					//elem.tooltip('option', 'content', 'Ajax call complete');
					elem.tooltip('option', 'content', result);
				}
			});
		}*/
	});

	$(".tooltip").mouseout(function(){
	   // re-initializing tooltip
	   $(this).attr('title','Please wait...');
	   $(this).tooltip();
	   $('.ui-tooltip').hide();
	 });
});
</script>
 
<h2><span style="font-weight: bold;">Family Tree</span></h2>

<br><br>


<center><img src="http://msbhogalnsons.com/new/images/familytree.jpg" width="745" height="737" border="0" usemap="#Map"></center>
<br><br>

<map name="Map" id="Map">
	<area shape="rect" coords="345,636,397,667" id='user_1' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="348,542,399,573" id='user_2' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="175,525,224,558" id='user_3' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="263,487,317,523" id='user_4' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="341,444,400,483" id='user_5' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="439,476,494,517" id='user_6' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="491,541,547,577" id='user_7' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="168,442,221,481" id='user_8' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="541,437,589,472" id='user_9' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="156,354,209,393" id='user_10' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="559,289,614,325" id='user_11' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="290,108,341,145" id='user_12' class="tooltip" title="" href="javascript:;" />
	<area shape="rect" coords="395,140,450,175" id='user_13' class="tooltip" title="" href="javascript:;" />
</map>


PK 99