Results 1 to 2 of 2

Thread: trigger javascript tooltip with tab

  1. #1
    Join Date
    May 2006
    Posts
    98
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Default trigger javascript tooltip with tab

    Hi there, Looking at website accessibility standards, does anyone know if a mouseover javascript tooltip can be triggered by the tab button too. I cannot get mine too and wonder if there is a solution to satisfy accessibility issues?
    I have found how to do it with onfocus, but using the tab the tooltips position now follows the cursors position and does not stay next to the link. Is there a solution to this?
    Thanks
    Richard
    Last edited by rich1234; 09-04-2007 at 09:22 PM.

  2. #2
    Join Date
    May 2006
    Posts
    98
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Default onfoucs tooltip

    Hi, Catching up on this post, I was just wondering if this is the bit that could be modified so that onfocus the tip stays with the link and doesnt follow the mouse.


    Code:
    var Tooltip = {
        followMouse: false,
        offX: 8,
        offY: 12,
        tipID: "tipDiv",
        showDelay: 100,
        hideDelay: 200,
    ready:false,timer:null,tip:null,init:function(){if(document.createElement&&document.body&&typeof document.body.appendChild!="undefined"){if(!document.getElementById(this.tipID)){var el=document.createElement("DIV");el.id=this.tipID;document.body.appendChild(el);}this.ready=true;}},show:function(e,msg){if(this.timer){clearTimeout(this.timer);this.timer=0;}if(!this.ttready)return;this.tip=document.getElementById(this.tipID);if(this.followMouse)dw_event.add(document,"mousemove",this.trackMouse,true);this.writeTip("");this.writeTip(msg);viewport.getAll();this.positionTip(e);this.timer=setTimeout("Tooltip.toggleVis('"+this.tipID+"', 'visible')",this.showDelay);},writeTip:function(msg){if(this.tip&&typeof this.tip.innerHTML!="undefined")this.tip.innerHTML=msg;},positionTip:function(e){if(this.tip&&this.tip.style){var x=e.pageX?e.pageX:e.clientX+viewport.scrollX;var y=e.pageY?e.pageY:e.clientY+viewport.scrollY;if(x+this.tip.offsetWidth+this.offX>viewport.width+viewport.scrollX){x=x-this.tip.offsetWidth-this.offX;if(x<0)x=0;}else x=x+this.offX;if(y+this.tip.offsetHeight+this.offY>viewport.height+viewport.scrollY){y=y-this.tip.offsetHeight-this.offY;if(y<viewport.scrollY)y=viewport.height+viewport.scrollY-this.tip.offsetHeight;}else y=y+this.offY;this.tip.style.left=x+"px";this.tip.style.top=y+"px";}},hide:function(){if(this.timer){clearTimeout(this.timer);this.timer=0;}this.timer=setTimeout("Tooltip.toggleVis('"+this.tipID+"', 'hidden')",this.hideDelay);if(this.followMouse)dw_event.remove(document,"mousemove",this.trackMouse,true);this.tip=null;},toggleVis:function(id,vis){var el=document.getElementById(id);if(el)el.style.visibility=vis;},trackMouse:function(e){e=dw_event.DOMit(e);Tooltip.positionTip(e);}};eval('\x54\x6f\x6f\x6c\x74\x69\x70\x2e\x74\x74\x72\x65\x61\x64\x79\x3d\x74\x72\x75\x65\x3b');
    
    function doTooltip(e, msg) {
      if ( typeof Tooltip == "undefined" || !Tooltip.ready ) return;
      Tooltip.show(e, msg);
    }
    
    function hideTip() {
      if ( typeof Tooltip == "undefined" || !Tooltip.ready ) return;
      Tooltip.hide();
    }
    
    onload=function(){
    Tooltip.init();
    for (var i_tem = 0; i_tem < document.links.length; i_tem++)
    if (document.links[i_tem].id&&document.links[i_tem].id.indexOf('tip')==0){
    document.links[i_tem].onmouseover=function(e){if (e)doTooltip(e, eval(this.id));else doTooltip(event, eval(this.id));}
    document.links[i_tem].onmouseout=hideTip;
    }
    }
    Any help would be greatly appreciated.
    Thanks
    Richard

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •