$(document).ready(function(){ //define this variable as global to avoid scope issues var TEMP_title; $('a[title=begpole], a[title=int1], a[title=int2], a[title=int3], a[title=adv], a[title=adv2], a[title=adv3], a[title=polespin], a[title=polemoves], a[title=poleclass], a[title=spinintense], a[title=poletease], a[title=polecab], a[title=advmoves], a[title=funk]').hover(function(e){ var pos = $(this).offset(); pos = pos.left; getData('/classes/poleandexotic/poledancingcourses.aspx', this, pos); }, function(){ $('.tooltip').remove(); $(this).attr('title', TEMP_title); }); $('a[title=polepower], a[title=polesations], a[title=poleflex]').hover(function(e){ var pos = $(this).offset(); pos = pos.left; getData('/classes/poleandexotic/casualclasses.aspx', this, pos); }, function(){ $('.tooltip').remove(); $(this).attr('title', TEMP_title); }); $('a[title=exotica], a[title=striptease], a[title=burlesque]').hover(function(e){ var pos = $(this).offset(); pos = pos.left; getData('/classes/poleandexotic/exoticdancingcourses.aspx', this, pos); }, function(){ $('.tooltip').remove(); $(this).attr('title', TEMP_title); }); $('a[title=tasteteaser]').hover(function(e){ var pos = $(this).offset(); pos = pos.left; getData('/classes/poleandexotic/workshops.aspx', this, pos); }, function(){ $('.tooltip').remove(); $(this).attr('title', TEMP_title); }); function getData(URL, $this, pos){ //make sure link being hovered has position relative, so the tooltip doesn't position itself to parent DOM object (eg. ) $($this).css("position", "relative"); //use title to find div dynamically var GET_ID = $($this).attr('title'); GET_ID = GET_ID.toLowerCase(); //jQuery ajax request $.ajax({ url: URL, global: false, type: "POST", data: {}, dataType: "html", success: function(msg){ var response = $(msg).find('#'+GET_ID+''); $('.tooltip').html($(response)); } }); //dump current title into a var TEMP_title = $($this).attr('title'); //remove title from link while it is being hovered so it doesn't appear above tooltip (as browser tag) $($this).attr('title', ''); //append tooltip to the link and give it class of 'tooltip', and include title and caption $($this).append(''); if(pos < 250){ $('.tooltip').css('left', 0); } //fade it in for visual effect! $('.tooltip').fadeIn(200); }//getData });