[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 188
  • Last Modified:

A title tag

I am using <a title="MRN: 2614823   Visit#: 212011844   Age: 66Y    Badge#: 48375     Admit D/T: 3 Jun 01  1934"><big><big>BAKER-LODGE,</big></big><small><br>Badge#: 48375</br></small></a>

The problem with this is that the yellow tool tip "MRN: 2614823   Visit#: 212011844   Age: 66Y    Badge#: 48375     Admit D/T: 3 Jun 01  1934" disappears in 5 sec in IE 4.x or greater. My question is how can I make it stay there forever?
0
richardbe
Asked:
richardbe
  • 12
  • 5
  • 2
  • +3
1 Solution
 
COBOLdinosaurCommented:
You have to make it a layer with absolute positioning and visibility set to hidden.  Then on mouseOver you change the visibility.  The hard part is getting the positioning correct.

One question though.  If you want it to stay visibile forever, why would you not just make it the text of the link so it is always there? Putting the text in a yellow box like a tool tip is not difficult.

Cd&
0
 
richardbeAuthor Commented:
Because there is not enough room to display the text. It has to be a tool tip.

Are you saying there is no easy way to do this? With <a title> tags?

Can you explain this? Do you have sample code?
"You have to make it a layer with absolute positioning and visibility set to hidden.  Then on mouseOver
you change the visibility.  The hard part is getting the positioning correct."
0
 
GeoffKellCommented:
Have a look at

http://www.dynamicdrive.com/dynamicindex5/popinfo2.htm

for a popup tooltip example including code

Regards
GK
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
richardbeAuthor Commented:
Yeah but this is for a hyperlink not for straight text...
0
 
COBOLdinosaurCommented:
The tooltip goes in a div like this:

<div id="thediv" style="position:absolute;left:xxx;top:yyy;visibility:hidden;z-index:10">
the text of the tool tip
</div>

Then on the anchor:

<a href="blah" onMouseover="makevisible('thediv')">

And the make visibile function looks like this:

<script language="JavaScript">
<!--
   function makevisibile(EL)
   {
      if (document.all) document.all[EL].style.visibility="visible"
      else if (document.layers) document.layers[EL].visibility="visible"
      else if (document.getElementById) document.getElementById(EL).style.visibility="visible";
   }
//-->
</script>


The part that we don't have here is what the value of xxx and yyy are
and that determines the position on the screen of the displayed tooltip.

Cd&


     
0
 
COBOLdinosaurCommented:
It has to be on a link if you want it to work in Netscape 4.x  If you don't
need to support NS then we have more options.

Cd&
0
 
richardbeAuthor Commented:
I don't need to support NS. I need the simplest way to make it work in IE 4.x or greater.
0
 
COBOLdinosaurCommented:
Okay drop this in your browser and see how close it is to what you want:


<html><head>
</head><body>
<a onMouseover="document.all['thediv'].style.visibility='visible'">
<big><big>BAKER-LODGE,</big></big><small><br>Badge#: 48375</br></small>
</a>
<div id="thediv" style="background-color:lightyellow;color:black;
border:1px solid black;visibility:hidden;width:175">
MRN: 2614823 Visit#: 212011844 Age: 66Y Badge#: 48375 Admit D/T: 3 Jun 01 1934
</div>
</body>
</html>



Cd&
0
 
richardbeAuthor Commented:
NO it has to be a tool tip, it should not affect the formatting of any of the existing text.
0
 
webwomanCommented:
It CAN'T be a tooltip and work the way you want. Either it doesn't time out and it's not a tooltip, or it's a tooltip and times out. There's no other option.
0
 
webwomanCommented:
And if there's not enough room to display it, why does it have to be there forever? If it's there, there's enough room. If it's not, then it goes away.
0
 
COBOLdinosaurCommented:
Richard you have me confused.  You want it to look like a tooltip, but you don't want it to act like a tooltip by timing out, and now you are saying it needs to be a tool tip. What formatting is it affecting? Is it the positioning that is a problem or you want it to float with the cursor like a tt?

What am I failing to understand?  I think what you want can be done, but I need to understand what you expect it to look like.

Cd&
0
 
COBOLdinosaurCommented:
Okay, you're not talking to me anymore, probably in a timezone where the day
is over, so I'll take a guess and see if this gets it closer and check back
in the morning.

<html>
<head>
<script language="JavaScript">
<!--
   var CURREL=false;
   function dragEvnt()
   {
      if (CURREL)
      {
         var WIN=window.event;
         CURREL.style.top=WIN.y+10;
         CURREL.style.left=WIN.x+10;
      }
   }

   function tipUP(EL)
   {
      CURREL=document.all[EL];
      CURREL.style.visibility="visible";
   }

   function tipDN()
   {
      CURREL.style.visibility="hidden";
      CURREL=false;
   }
//-->
</script>

</head>
<BODY onMouseMove="dragEvnt()">
<a onMouseover="tipUP('thediv')" onMouseout="tipDN()">
<big><big>BAKER-LODGE,</big></big><small><br>Badge#: 48375</br></small>
</a>
<div id="thediv" style="background-color:lightyellow;color:black;
border:1px solid black;visibility:hidden;width:175;z-index:10;position:absolute">
MRN: 2614823 Visit#: 212011844 Age: 66Y Badge#: 48375 Admit D/T: 3 Jun 01 1934
</div>
</body>
</html>

Cd&

0
 
richardbeAuthor Commented:
Perfect!!! It works. Thank you very much. YOu've solved my problem. IT's always nice to have a technical expert when you need one.
0
 
COBOLdinosaurCommented:
Okay that's great. I'll make that an answer, then.  If you need more help, I'm this forum most days.

Cd&
0
 
COBOLdinosaurCommented:
richard,

It looks like you forgot to grade this.  It can't get moved to the database until you accept an answer and grade it.

Cd&
0
 
COBOLdinosaurCommented:
Hello Richard.  Did you forget this?

Cd&
0
 
markg_23Commented:
The easy way to maintain a tool tip display forever o the time you desire is:

<elsement STYLE="behavior:url('tooltip.htc')" ID=sID DURATION=(Time in miliseconds)>

if you specify -1 as DURATION the tooltip will stay forever
0
 
COBOLdinosaurCommented:
behaviors are not support in ie 4. And the require is support for IE4+.  

Cd&
0
 
COBOLdinosaurCommented:
Oh and also requires user enabling.

Cd&
0
 
ComTechCommented:
The proposed answer will be accepted.  This question will be close.

Thank you,
ComTech
Community Support Moderator
0
 
COBOLdinosaurCommented:
Thanks CT :^)

Cd&
0

Featured Post

Prep for the ITIL® Foundation Certification Exam

December’s Course of the Month is now available! Enroll to learn ITIL® Foundation best practices for delivering IT services effectively and efficiently.

  • 12
  • 5
  • 2
  • +3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now