How to create a hot spots with a hover button?

[Strem]

I am creating a calendar and i would like to have this action performed:
when the mouse hovers over a date it will comes up with the (text)events for
that day? is this possible?do i need to create a seperate page for each dates
information? thanks sam

 

[Mike Mueller]

:I am creating a calendar and i would like to have this
action performed:
: when the mouse hovers over a date it will comes up with
the (text)events for
: that day? is this possible?do i need to create a seperate
page for each dates
: information? thanks sam

There are all sorts of tricks you can do. The script file I
use is called wz_tooltip.js There is plenty of info on
google relative to this script.

In use:
http://www.lannonfire.com/Projects/Pop-Up_Calendar.htm

 

[Mike Mueller]

wz_tooltip.js instructions:
http://www.devira.com

:I am creating a calendar and i would like to have this
action performed:
: when the mouse hovers over a date it will comes up with
the (text)events for
: that day? is this possible?do i need to create a seperate
page for each dates
: information? thanks sam

 

[Murray]

Of course you will have to hand code all that pop-up information into each
tooltip. Sounds hard to me.

 

[Mike Mueller]

It is pretty flexible- I redid it using an <iframe> for the
popup, and bookmarking the dates on the iframe source page
Version 2:
http://www.lannonfire.com/Projects/Pop-Up_Calendar_v2.html



: Of course you will have to hand code all that pop-up
information into each
: tooltip. Sounds hard to me.
:
: --
: Murray
: --------------
: MVP FrontPage
:
:
: : > wz_tooltip.js instructions:
: > http://www.devira.com
: >
message
: >
: > :I am creating a calendar and i would like to have this
: > action performed:
: > : when the mouse hovers over a date it will comes up
with
: > the (text)events for
: > : that day? is this possible?do i need to create a
seperate
: > page for each dates
: > : information? thanks sam
: >
: >
:
:

 

[Trevor L.]

There are all sorts of tricks you can do. The script file I
use is called wz_tooltip.js There is plenty of info on
google relative to this script.

In use:
http://www.lannonfire.com/Projects/Pop-Up_Calendar.htm

This calendar is great

I used to use wz_tooltip but I changed to a simpler tooltip script, and then
stopped using it when I found that title= does everthing I need.

Actually, title= probably doesn't do everything. I like the way you have
formatted the tooltip on the calendar. This idea is similar to my use of a
style on the toolTip <div>, but is much prettier.

For reference, here is the script I changed to:
/* tooltip.js */
// Finds mouse position - for use in toolTip()
Mouse = {} // defines the object 'Mouse'
Mouse.doc = document // adds the property 'doc'
Mouse.MouseMoveHandler = function (e) // adds the method 'MouseMoveHandler'
{
e = e || window.event
Mouse.x = (Mouse.doc.body.scrollLeft ||
Mouse.doc.documentElement.scrollLeft || 0) + e.clientX
Mouse.y = (Mouse.doc.body.scrollTop ||
Mouse.doc.documentElement.scrollTop || 0) + e.clientY
Mouse.currentTarget = e.target || e.srcElement
return true
}
if (Mouse.doc.attachEvent)
Mouse.doc.attachEvent("onmousemove",Mouse.MouseMoveHandler)
else if (Mouse.doc.addEventListener)
Mouse.doc.addEventListener("mousemove",Mouse.MouseMoveHandler,false)
//------------------------------
// Capture events on mousemove - for use in toolTip()
if (document.captureEvents)
document.captureEvents(Event.mousemove)
//-------------------------------
// Write toolTip <div>
document.write('<div id="toolTip" style="z-index:1;width:100px;"></div>')
//------------------------------
function toolTip(text,me)
{
var theObj = me
var theElemt = document.getElementById('toolTip')
var tipTxt = text.split("|")
var len = tipTxt.length
var i
text = ''
for (i = 0; i < len; i++)
{ text += tipTxt
if (i+1 != len)
text += '<br />' }
theElemt.innerHTML = text
theElemt.style.display = "block"
theObj.onmousemove = updatePos
window.onscroll = updatePos
//-------------------------------
function updatePos()
{
var diffX = 12 // offset to clear pointer
var posX = Mouse.x + diffX
var posY = Mouse.y
// adjust position when too close to edge
posX -= (posX > screen.width * 0.75) ? (theElemt.clientWidth + diffX*2)
: 0
posY -= (posY > screen.height * 0.75) ? (theElemt.clientHeight) : 0
theElemt.style.left = posX + "px"
theElemt.style.top = posY + "px"
theObj.onmouseout = function hideMe()
{ theElemt.style.display = "none" }
}
}
//-------------------------------
/** Uses style
#toolTip {
position: absolute;
display: none;
background-color: #ffc ;
font-family: verdana,arial,helvetica,sans-serif;
font-size: 62.5% ;
padding: 1px;
border: black solid 1px;
}
**/