ASP.NET Custom Server Controls: Cute ToolTip Control with Better Framework - JavaScripts: from custom control

(Page 4 of 6 )

Until now, we have seen only the ASP.NET custom control code, but didn’t go through JavaScript code at all.  Now we shall go through the main JavaScript method “getJS4ToolTip” step by step:

Dim js As String
        js = "<script language=""javascript""
src=""IFrameBox.js""></script>"

The above simply declares “js” as a variable of string.  It starts linking (or including) with external JavaScript file “IFrameBox.js”.

        js &= "<script language=""javascript"">"
        js &= "var IframeBox = new IFrameBox(""frIFrame"",
""IframeBox"", 147, 207); "

After that, we open another JavaScript tag and create an object for the “IFrameBox” class (defined in IFrameBox.js file) with the name of the IFRAMEID, the current object, width and height.

        js &= "function ShowToolTip(obj,msg,wdth)"
        js &= "{"
        js &= " IframeBox.Show(obj,msg,wdth);"
        js &= "}"

The above is a simple JavaScript based function, which simply shows the tooltip with the specified message and width.  This would further call the functions in “IFrameBox.js”.

       js &= "function HideToolTip()"
        js &= "{"
        js &= "document.all(""frIFrame"").style.visibility =
""hidden"";"
        js &= "document.all(""frIFrame"").style.width = 0;"
        js &= "document.all(""frIFrame"").style.height = 0;"
        js &= "}"

And finally, the above JavaScript function simply hides the tooltip (generally at “mouseout”) with simple CSS.

Next: JavaScripts: from IFrameBox.js >>
 

More ASP.NET Articles
More By Jagadish Chaterjee

Comments On: ASP.NET Custom Server Controls: Cute ToolTip Control with Better Framework

· Hello....an improved version of Cute tooltip control released...have a look at it...   >>> Post your comment now!