More actions
adding new hook for tooltip |
m under development |
||
| Line 99: | Line 99: | ||
**********************************************************/ | **********************************************************/ | ||
var _tooltipClassName = 'uniwiki-tooltip'; | var _tooltipClassName = 'uniwiki-tooltip'; | ||
var _tooltipFrameClassName = 'uniwiki-tooltip-frame'; | |||
var _activeTooltipIdx = -1; | |||
function checkElementByClassComp() { | function checkElementByClassComp() { | ||
if (document.getElementsByClassName == undefined) { | if (document.getElementsByClassName == undefined) { | ||
| Line 119: | Line 121: | ||
function createTooltipTrigger() { | function createTooltipTrigger() { | ||
var tooltips = document.getElementsByClassName(_tooltipClassName); | var tooltips = document.getElementsByClassName(_tooltipClassName); | ||
for(var i=0;i<tooltips.length;i++) | for(var i=0;i<tooltips.length;i++) { | ||
tooltips[i].setAttribute( 'id', 'tooltipidx-' + i ); | tooltips[i].setAttribute( 'id', 'tooltipidx-' + i ); | ||
tooltips[i].setAttribute( 'onmouseout', 'showTooltip(' + i + ')' ); | |||
tooltips[i].setAttribute( 'onmouseover', 'hideTooltip()'); | |||
var matchFrameClassName = new RegExp("(?:^|\\s)" + _tooltipFrameClassName + "(?:$|\\s)"); | |||
var innerTooltipEls = tooltips[i].getElementsByTagName('*'); | |||
for(var j=0;(innerEl = innerTooltipEls[j]) != null;j++) { | |||
if(innerEl && innerEl.indexOf(_tooltipFrameClassName) != -1 && matchFrameClassName.test(innerEl.className)) { | |||
tooltips[i].setAttribute( 'id', 'tooltipframeidx-' + i ); | |||
} | |||
} | |||
} | |||
} | |||
function tooltipMouseHandler(e) { | |||
if (!e){ e = window.event; } | |||
mouseX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; | |||
mouseY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop; | |||
moveTooltip(mouseX, mouseY); | |||
} | |||
function moveTooltip(x, y) { | |||
if(_activeTooltipIdx != -1) { | |||
document.getElementById('tooltipidx' + _activeTooltipIdx).style.left = x + 15 + 'px'; | |||
document.getElementById('tooltipidx' + _activeTooltipIdx).style.top = y + 'px'; | |||
} | } | ||
return false; | |||
} | |||
function showTooltip(id) { | |||
document.onmousemove = tooltipMouseHandler; | |||
_activeTooltipIdx = id; | |||
document.getElementById( 'tooltipidx-' + i ).style.display = 'block'; | |||
} | } | ||
function hideTooltip() { | |||
document.getElementsByClassName(_tooltipClassName).style.display = 'none'; | |||
_activeTooltipIdx = -1; | |||
document.onmousemove = null; | |||
} | |||
addOnloadHook(checkElementByClassComp); | addOnloadHook(checkElementByClassComp); | ||
addOnloadHook(createTooltipTrigger); | addOnloadHook(createTooltipTrigger); | ||