Ich würde auf der unten angegebenen Seite, den Tooltip (mit Maus über irgendeine Zahl fahren damit Tooltip erscheint) gern wie folgt ausrichten:
- Tooltip soll mittig über der Tabelle erscheinen
- Größe des Tooltips soll sich an Inhalt, also Text, anpassen
-Zwischen Tooltip und Tabelle sollte ein kleiner Abstand sein
Hab diesen Tooltip nun nach langem Hin und Her nun per Java eingebunden, komme mit der Formatierung allerdings nicht klar, d.h. ich weis nicht genau woher der Tooltip weiß das er links oben über der Tabelle erscheinen muss usw.). Ich bin für jede Hilfe dankbar.
Hier die Seite: "http://sccg09.cockerspaniel-gehren.de/index.php?option=com_content&view=article&id=62:chronik&catid=34:mannschaft"
Hier der Code:
//CSS-Code//
#tooltip{
width:200px;
height:100px;
border:1px solid black;
background:#FFFFff;
display:block;
white-space:nowrap;
}
#datable{
}
//Java//
<script type="text/javascript">
function writeTooltip(text){
var target = document.getElementById("tooltip");
target.innerHTML=text;
target.style.visibility="visible";
}
function hideTip(){
var target = document.getElementById("tooltip");
target.style.visibility="hidden";
}
</script>
Der Code im Body sollte erst mal uninteressant sein, da ich dies eigentlich über CSS regeln möchte und da ich mit Joomal arbeite der CSS Code ja in einer separaten Datei liegt.
- Tooltip soll mittig über der Tabelle erscheinen
- Größe des Tooltips soll sich an Inhalt, also Text, anpassen
-Zwischen Tooltip und Tabelle sollte ein kleiner Abstand sein
Hab diesen Tooltip nun nach langem Hin und Her nun per Java eingebunden, komme mit der Formatierung allerdings nicht klar, d.h. ich weis nicht genau woher der Tooltip weiß das er links oben über der Tabelle erscheinen muss usw.). Ich bin für jede Hilfe dankbar.
Hier die Seite: "http://sccg09.cockerspaniel-gehren.de/index.php?option=com_content&view=article&id=62:chronik&catid=34:mannschaft"
Hier der Code:
//CSS-Code//
#tooltip{
width:200px;
height:100px;
border:1px solid black;
background:#FFFFff;
display:block;
white-space:nowrap;
}
#datable{
}
//Java//
<script type="text/javascript">
function writeTooltip(text){
var target = document.getElementById("tooltip");
target.innerHTML=text;
target.style.visibility="visible";
}
function hideTip(){
var target = document.getElementById("tooltip");
target.style.visibility="hidden";
}
</script>
Der Code im Body sollte erst mal uninteressant sein, da ich dies eigentlich über CSS regeln möchte und da ich mit Joomal arbeite der CSS Code ja in einer separaten Datei liegt.
