Ich hatte ja vor nicht allzu langer Zeit schon erwähnt das ich ne Tooltip Anwendung erstellen wollte. Leider hat es die Zeit nicht ganz zugelassen.
Seit APEX 4.0 sind die Tooltips ja eh dynamisch und eigentlich brauch jetzt niemand mehr ne Speziallösung! Eigentlich...
Es gibt eine Tooltip Art die APEX noch nicht von Haus aus unterstützt:
Moveover-TooltipsAnzeige einer Infobox wenn ich mich über dem Item befinde.
Beispiel:
http://www.ta-it-consulting.de/tooltip_example.htmlDie Lösung basiert auf dem Quellcode von Swazz mit ihrem Tooltip Plugin:
Boxover.
Paulo Vale schrieb bereits über die Integration dieses Tooltips. Damit auch die Deutsche Community dran teilhaben darf, dachte ich mir, ich erweitere die Anleitung und zeige was alles möglich ist.
Leider ist die offizielle Beispielseite nicht mehr Online. Die Javascript Datei könnt ihr hier runterladen:
http://ta-it-consulting.de/boxover_tooltip.js1. Installation - HTML Header:
<!-- TOOLTIP START -->
// Source code
<script type="text/javascript" src="#APP_IMAGES#boxover_tooltip.js"></script>
// Erweitertes Layout
<style type="text/css">
.hlpHeader{font-weight:bold;width:320px;font-family:arial;border:1px solid #6F6F6F;padding:3;fontsize:11;
color:#FFFFFF;background:#8F8F8F;filter:alpha(opacity=85);opacity:0.85;
}
.hlpBody{width:320px;font-family:arial;border-bottom:1px solid #6F6F6F;border-left:1px solid #6F6F6F;
border-right:1px solid #6F6F6F;padding:3;fontsize:11;color:#FFFFFF;background:#BFBFBF;filter:alpha(opacity=85);
opacity:0.85;
}
</style>
<!-- TOOLTIP END -->
2. Konfiguration - Item > HTML Form Element Attributes:
Beispiel 1:
TITLE="header=[Information] body=[Hilfetext fuer dieses Item]"
Beispiel 2:
TITLE="cssbody=[hlpBody] cssheader=[hlpHeader] header=[Information] body=[Hilfetext]"
Beispiel 3:
TITLE="fixedrelx=[1] fixedrely=[-56] header=[Information] body=[Hilfetext]"
Anleitung:http://opatia.com/js/BoxOverParameters.htmEinstellungsmöglichkeiten:
Parameter |
Mögliche Werte |
Default |
Beschreibung |
header |
Any character |
blank |
Specifies the header text of the caption |
body |
Any character |
blank |
Specifies the body text of the caption |
fixedrelx |
Any integer |
N/A |
Forces the X-coordinate of the caption to stay fixed (offset is relative to the annotated HTML element) |
fixedrely |
Any integer |
N/A |
Forces the Y-coordinate of the caption to stay fixed (offset is relative to the annotated HTML element) |
fixedabsx |
Any integer |
N/A |
Forces the X-coordinate of the caption to stay fixed (X is an offset relative to the body of the HTML document) |
fixedabsy |
Any integer |
N/A |
Forces the Y-coordinate of the caption to stay fixed (Y is an offset relative to the body of the HTML document) |
windowlock |
On / Off |
On |
Make caption stick to side of the window if user moves close to the side of the screen. |
cssbody |
Any defined style class |
Built in styles |
Specifies CSS class for styles to be used on caption body. |
cssheader |
Any defined style class |
Built in styles |
Specifies CSS class for styles to be used on caption header. |
offsetx |
Any integer |
10 |
Horizontal offset, in pixels, of the caption relative to the mouse cursor. |
offsety |
Any integer |
10 |
Vertical offset, in pixels, of the caption relative to the mouse cursor. |
doubleclickstop |
On / Off |
On |
Specifies whether to halt the caption when the user double clicks on the HTML element with the caption. |
singleclickstop |
On / Off |
Off |
Specifies whether to halt the caption when the user single clicks on the HTML element with the caption.
- if both singleclickstop and doubleclickstop are set to "on", singleslclickstop takes preference. |
requireclick |
On / Off |
Off |
Specifies whether the user must first click the element before a
tooltip appears. Intended for use on links so that information appears
while the link is followed. |
hideselects |
On / Off |
Off |
Specifies whether to hide all SELECT boxes on page when popup is activated. |
fade |
On / Off |
Off |
Specifies whether to fade tooltip into visibility. |
fadespeed |
Number between 0 and 1 |
0.04 |
Specifies how fast to fade in tooltip. |
delay |
Any integer |
0 |
Specifies delay in milliseconds before tooltip displays. |
