Focal Point
[Solved]Tooltip positions in HTML file

This topic can be found at:
https://forums.informationbuilders.com/eve/forums/a/tpc/f/7971057331/m/6707011386

July 14, 2016, 04:44 PM
WebFocusDiver
[Solved]Tooltip positions in HTML file
I am adding tooltip to the HTML file. right now the text show up below the each element. I would like to move it to above/left/right/below based on the position of the element. For example, I have this control that on the left top corner of the HTML page. I would like to have the title showing on the right side of the element box.

Here is the javascript

 
if(typeof(bRuntime) != 'undefined') {
// TODO: Add your inline runtime code here}
//Begin function window_onload
function window_onload() {
UpdateData();
// TODO: Add your event handler code here
//add onInitialUpdate() function to make changes before initial run of the reports
//Call function after window has loaded
}
//End function window_onload
function onInitialUpdate() {
$( this ).tooltip();
}
//Begin function checkreporttype
function checkreporttype(){
var ReportType = IbComposer_getCurrentSelection('ReportSelectionList');
if (ReportType == 'Measurable')
{
IbComposer_runAnimation('hidecashflow');
IbComposer_runAnimation('showmeasure');
}
else {
IbComposer_runAnimation('hidemeasure');
IbComposer_runAnimation('showcashflow');
}
}
//End function checkreporttype
 

Here is the internal css
 
.ui-tooltip-content::after {
    border-style: solid;
 left: 90px;
 display: block;
 position: absolute;
 content: "";


}
.ui-tooltip-content::before {
    border-style: solid;
 left: 90px;
 display: block;
 position: absolute;
 content: "";


}
.ui-tooltip-content::before {
    border-width: 10px 10px 0px;
 border-color: rgb(170, 170, 170) transparent;
 bottom: -10px;


}
.ui-tooltip-content::after {
    border-width: 10px 10px 0px;
 border-color: white transparent;
 bottom: -7px;

}


that I have.

Help please. Thank you

This message has been edited. Last edited by: WebFocusDiver,


WebFOCUS 8.1.05
Windows, All Outputs
July 20, 2016, 08:53 AM
Squatch
if(typeof(bRuntime) != 'undefined') {
// TODO: Add your inline runtime code here
}

function window_onload() {
UpdateData();

$("#listbox1").tooltip({
      position: {
        my: "right+225",
        at: "center"
      }
    });
}

function onInitialUpdate() {
    $( document ).tooltip();
}



App Studio
WebFOCUS 8.1.05M
Windows, All Outputs
July 20, 2016, 09:05 AM
Squatch
You will also need to click on your control/element, then go to the Properties panel and add your tooltip text to the "Title" property.


App Studio
WebFOCUS 8.1.05M
Windows, All Outputs
July 20, 2016, 02:43 PM
WebFocusDiver
Thanks.


WebFOCUS 8.1.05
Windows, All Outputs