JavaScript - Adding Close Link To Sticky Tooltip

function obj_position(obj,id) {
    //Setup variables to hold position values
    var left = top = 0;
   
    if (obj.offsetParent) {
        do {
            //Get position values and put in variables
            left += obj.offsetLeft;
            top += obj.offsetTop;
        } while (obj = obj.offsetParent);
    }
    //Get alt content for tooltip
    var alt_message = document.getElementById(id).getAttribute('alt');
    return left+","+top+","+alt_message;
}
function display_tooltip(obj) {
    //Get the elementID first
    var elmID = obj.id;
   
    //First of all get the position data for current element
    //Also get the message to be displayed- contained in the alt
    var pos_mess = obj_position(obj,elmID);
   
    //Now splitup the returned string to get the lef _position, right
    //position and the message to be displayed
    var part = pos_mess.split(",");
   
    //Create variables for the parts
    var left_pos = part[0];
    var top_pos = part[1] - 18;
    var message = part[2];
   
    var container = document.getElementById('tooltip_container');
    var newdiv = document.createElement('div');
    newdiv.setAttribute('id','tooltip');
    newdiv.className = 'tooltip_style';
    newdiv.innerHTML = message;
   
    //Position div
    newdiv.style.position="absolute";
    newdiv.style.top=top_pos+"px";
    newdiv.style.left=left_pos+"px";
   
    //Append newly created div to container
    container.appendChild(newdiv);
   
}
function delete_tooltip() {
    var container = document.getElementById('tooltip_container');
    var old_div = document.getElementById('tooltip');
    container.removeChild(old_div);
}

on (release) {
	getURL("example1.html", "_blank");
}

onClick="MM_goToURL('parent','example2.html')"

onClick="window.close()"

<script type="text/javascript">
$(document).ready(function() {
    //Tooltips
    $(".tip_trigger").hover(function(){
        tip = $(this).find('.tip');
        tip.show(); //Show tooltip
    }, function() {
        tip.hide(); //Hide tooltip
    }).mousemove(function(e) {
        var mousex = e.pageX - 90; //Get X coodrinates
        var mousey = e.pageY  - 400; //Get Y coordinates
        var tipWidth = tip.width(); //Find width of tooltip
        var tipHeight = tip.height(); //Find height of tooltip

        //Distance of element from the right edge of viewport
        var tipVisX = $(window).width() - (mousex + tipWidth);
        //Distance of element from the bottom of viewport
        var tipVisY = $(window).height() - (mousey + tipHeight);

        if ( tipVisX < 90 ) { //If tooltip exceeds the X coordinate of viewport
            mousex = e.pageX - tipWidth - 90;
        } if ( tipVisY < 90 ) { //If tooltip exceeds the Y coordinate of viewport
            mousey = e.pageY - tipHeight - 90;
        }
        //Absolute position the tooltip according to mouse position
        tip.css({  top: mousey, left: mousex });
    });
});
</script>

<a
 href="http://www.javascriptkit.com/dhtmltutors/ajaxticker/index.shtml"
 rel="htmltooltip">RSS Ajax Ticker</a>

<!--Inline HTML Tooltips (DIV with class="htmltooltip"-->
<!--Matched up with anchor links with rel="htmltooltip" and in the order they appear within page's source-->

<a style='margin-left: 10px; position:relative' class="tooltip" title="This is some text to display">

$(document).ready(function(){

    $("a.tooltip").live( {
        mouseenter:
            function(e){
                this.t = this.title;
                this.title = "";
                $("body").append("<p id='tooltip'>"+ this.t +"</p>");
                $("#tooltip")
                    .css("top",(e.pageY - 10) + "px")
                    .css("left",(e.pageX + 20) + "px")
                    .fadeIn("fast");
                var css_width = $('#tooltip').width();
                var text_width = $('#tooltip').textWidth();
                if (css_width > text_width) {
                    $('#tooltip').width(text_width);
                }
            },
        mouseleave:
            function(){
                this.title = this.t;
                $("#tooltip").remove();
            }
        }
    );

});

$.fn.textWidth = function textWidth() {
    var html_org = $(this).html(); 
    var html_calc = '<span>' + html_org + '</span>'; 
    $(this).html(html_calc); 
    var width= $(this).find('span:first').width(); 
    $(this).html(html_org); 
    return width;
}

<a style='margin-left: 10px; position:relative' class="tooltip" width="100" title="This is some text to display">

<div rel="<?php echo $url;?>" class="cp-code">copied code</div>
<div class="test" style="display: none; border: 1px solid #ccc; padding: 8px;">click copy,test,test</div>

ZeroClipboard.setMoviePath("http://example.com/js/ZeroClipboard.swf");
var clip = null;
var url = '';
function init() {
    clip = new ZeroClipboard.Client();
    clip.setHandCursor( true );

    $('.cp-code').mouseover( function() {
        clip.setText(this.innerHTML);
             $('test').style.display = 'block';
        if (clip.div) {
            clip.receiveEvent('mouseout', null);
            clip.reposition(this);
        } else {
                        clip.glue(this);
                }
        clip.receiveEvent('mouseover', null);
        url = $(this).attr('rel');
    });

    clip.addEventListener('mouseUp', function(client) {
        window.open(url);
    });
clip.addEventListener('mouseOut', function (client) {
 $('test').style.display = 'none'; 
});
}

$(document).ready(function() {
	init();
});

initToolTips = function(){
	var anchors = document.getElementsByTagName("a");
	for(var i = 0; i < anchors.length; i++){
		var tip = anchors[i].getAttribute("tooltip");
		if(!tip) continue;

		var divHolder = document.createElement("div");
		var divTop = document.createElement("div");
		var divMid = document.createElement("div");
		var divBot = document.createElement("div");

		divHolder.className = "tooltip";  // color:#333;
		divTop.className = "tooltiptop"; // background:url(...) ;
		divMid.className = "tooltipmid"; // background:url(...) repeat-y;
		divBot.className = "tooltipbot"; // background:url(...);

		divHolder.appendChild(divTop);
		divHolder.appendChild(divMid);
		divHolder.appendChild(divBot);
		
		var atts = divHolder.style;

		anchors[i].onmouseover = function(e){ 
			divMid.innerHTML = e.target.getAttribute("tooltip");
			document.body.appendChild(divHolder);

			alert(divHolder.style.height); //divHolder is 
		}
		anchors[i].onmousemove = function(e){
			var ie = (document.all);
			if(ie){
				atts.marginLeft =(event.clientX) + "px";
				//atts.marginTop = (event.clientY - divTop.style.height - divMid.style.height - divBot.style.height)  + "px";
			}
			else{
				atts.marginLeft = (e.pageX) + "px";
				//atts.marginTop = (e.pageY - divTop.style.height - divMid.style.height - divBot.style.height) + "px";
			}
		}
		anchors[i].onmouseout = function(e){
			document.body.removeChild(divHolder);	
		}
	}
}

wren.initToolTips = function(){
	var anchors = document.getElementsByTagName("a");
	for(var i = 0; i < anchors.length; i++){
		var tip = anchors[i].getAttribute("tooltip");
		if(!tip) continue;

		var divHolder = document.createElement("div");
		var divTop = document.createElement("div");
		var divMid = document.createElement("div");
		var divBot = document.createElement("div");

		divHolder.className = "tooltip";
		divTop.className = "tooltiptop";
		divMid.className = "tooltipmid";
		divBot.className = "tooltipbot";

		divHolder.appendChild(divTop);
		divHolder.appendChild(divMid);
		divHolder.appendChild(divBot);
		
		var atts = divHolder.style;
		atts.display = "none";
		document.body.appendChild(divHolder);

		anchors[i].onmouseover = function(e){ 
			divMid.innerHTML = e.target.getAttribute("tooltip");
			atts.display = "inline";
			//alert(divHolder.style.height); //alerts nothing
		}
		anchors[i].onmousemove = function(e){
			var ie = (document.all);
			if(ie){
				atts.marginLeft =(event.clientX) + "px";
				//atts.marginTop = (event.clientY - divTop.style.height - divMid.style.height - divBot.style.height)  + "px";
			}
			else{
				atts.marginLeft = (e.pageX) + "px";
				//atts.marginTop = (e.pageY - divTop.style.height - divMid.style.height - divBot.style.height) + "px";
			}
		}
		anchors[i].onmouseout = function(e){
			atts.display = "none";
		}
	}
}

  <li id='1tab_1a' class='selected'><a id='1link_1a'  title="Customer Info Screen"><span >Customer Info</span></a></li>
  <li id='1tab_1b' ><a id='1link_1b'  title="Order Detail"  ><span>Order</span></a></li>
 
 <li id='1tab_1c' ><a id='1link_1c'  title="Phone Detail" ><span>Phone:  7093521232</span></a></li>