fernando/luos
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BUG-14909 The element tooltip dynaform is not displayed properly when you have scroll bars, this problem is given in Chrome and Safari. SOLVED

Browse Source
This commit is contained in:
Roly Rudy Gutierrez Pinto
2014-05-12 16:59:45 -04:00
parent d03a58fb0c
commit f0f696deda
1 changed files with 32 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
gulliver/js/widgets/tooltip/pmtooltip.js
View File

@@ -14,76 +14,43 @@
var tooltip_is_msie = (navigator.userAgent.indexOf('MSIE')>=0 && navigator.userAgent.indexOf('opera')==-1 && document.all)?true:false;
function showTooltip(e,tooltipTxt){
var bodyWidth = Math.max(document.body.clientWidth,document.documentElement.clientWidth) - 20;
if(!pmtooltip){
pmtooltip = document.createElement('DIV');
pmtooltip.id = 'pmtooltip';
pmtooltipShadow = document.createElement('DIV');
pmtooltipShadow.id = 'pmtooltipShadow';
document.body.appendChild(pmtooltip);
document.body.appendChild(pmtooltipShadow);
if(tooltip_is_msie){
pmiframe = document.createElement('IFRAME');
pmiframe.frameborder='5';
pmiframe.style.backgroundColor='#FFFFFF';
pmiframe.src = '#';
pmiframe.style.zIndex = 100;
pmiframe.style.position = 'absolute';
document.body.appendChild(pmiframe);
}
}
pmtooltip.style.display='block';
pmtooltipShadow.style.display='block';
if(tooltip_is_msie)pmiframe.style.display='block';
var st = Math.max(document.body.scrollTop,document.documentElement.scrollTop);
if(navigator.userAgent.toLowerCase().indexOf('safari')>=0)st=0;
var leftPos = e.clientX + 10;
pmtooltip.style.width = null; // Reset style width if it's set
pmtooltip.innerHTML = tooltipTxt;
pmtooltip.style.left = leftPos + 5 + 'px';
pmtooltip.style.top = e.clientY + st + 'px';
pmtooltipShadow.style.left = leftPos + pmshadowSize + 'px';
pmtooltipShadow.style.top = e.clientY + st + pmshadowSize + 'px';
if(pmtooltip.offsetWidth>pmtooltipMaxWidth){ /* Exceeding max width of tooltip ? */
pmtooltip.style.width = pmtooltipMaxWidth + 'px';
}
var tooltipWidth = pmtooltip.offsetWidth;
if(tooltipWidth<pmtooltipMinWidth)tooltipWidth = pmtooltipMinWidth;
pmtooltip.style.width = tooltipWidth + 'px';
pmtooltipShadow.style.width = pmtooltip.offsetWidth + 'px';
pmtooltipShadow.style.height = pmtooltip.offsetHeight + 'px';
if((leftPos + tooltipWidth)>bodyWidth){
pmtooltip.style.left = (pmtooltipShadow.style.left.replace('px','') - ((leftPos + tooltipWidth)-bodyWidth)) + 'px';
pmtooltipShadow.style.left = (pmtooltipShadow.style.left.replace('px','') - ((leftPos + tooltipWidth)-bodyWidth) + pmshadowSize) + 'px';
}
if(tooltip_is_msie){
pmiframe.style.left = pmtooltip.style.left;
pmiframe.style.top = pmtooltip.style.top;
pmiframe.style.width = pmtooltip.offsetWidth + 'px';
pmiframe.style.height = pmtooltip.offsetHeight + 'px';
}
if (!pmtooltip) {
pmtooltip = document.createElement('DIV');
pmtooltip.id = 'pmtooltip';
pmtooltipShadow = document.createElement('DIV');
pmtooltipShadow.id = 'pmtooltipShadow';
document.body.appendChild(pmtooltip);
document.body.appendChild(pmtooltipShadow);
}
var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
var xOffset = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);
var yOffset = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
var length = tooltipTxt.length * 4.5;
if (length < 100)
length = 100;
if (length > 400)
length = 400;
var x = e.clientX + 10 + xOffset;
var y = e.clientY + 5 + yOffset;
if (x + length > w) {
x = x - length - 20;
}
pmtooltip.style.display = 'block';
pmtooltip.innerHTML = tooltipTxt;
pmtooltip.style.left = x + 'px';
pmtooltip.style.top = y + 'px';
pmtooltip.style.width = length + 'px';
pmtooltipShadow.style.display = 'block';
pmtooltipShadow.style.left = (x + pmshadowSize) + 'px';
pmtooltipShadow.style.top = (y + pmshadowSize) + 'px';
pmtooltipShadow.style.width = pmtooltip.offsetWidth + 'px';
pmtooltipShadow.style.height = pmtooltip.offsetHeight + 'px';
}
function hideTooltip(){
pmtooltip.style.display='none';
pmtooltipShadow.style.display='none';
if(tooltip_is_msie)pmiframe.style.display='none';
}