CSS pop Up anpassen
Hallo
hab mal irgendwo von ner page ein gratis script kopiert und es eingefügt in meine page.
nun hab ich das problem dass sich die box nicht anpasst an den text - es also z.b. ein wort auf eine neue zeile nimmt obwohl ich gar kein <br> hingesetzt hab. (logisch - denn die box ist zu schmal)
habs mit dem befehl "width" versucht - ohne erfolg.
wäre super froh wenn sich das mal jemand anschauen könnte.
Ihr findet das script unter:
http://www.swisssoldiersclan.ch/matches.sthmlvielen dank
ubuntu_lova
Antwort schreiben
Antwort 1 von CSSrules vom 29.10.2019, 13:41 Options
Zitat:
Ihr findet das script unter: http://www.swisssoldiersclan.ch/matches.sthml
selbst nach der Korrektur der Endung auf .shtml finde ich dort kein Script. Poste hier doch mal einfach den Quelltext, um den es sich dreht.
Antwort 2 von ubunut_lova vom 29.10.2019, 14:09 Options
es ist ja in dem sinne auch kein script sondern ganz einfaches CSS (onmouseover, onmouseout)
hier der CSS teil:
<STYLE TYPE="text/css">
#dek {POSITION:absolute; left:520px; top:185px; VISIBILITY:hidden;Z-INDEX:200;}
</STYLE>
hier der HTML teil:
<td bgcolor="#CCCCCC"><div align="right"><span class="Stil15"><a href="#" ONMOUSEOVER="popup('-Slayer 50 : 30 PIT<br>-CTF 3 : 0 Narrow<br>-Odball 250 : 216 Construct<br>-Slayer 50 : 40 Construct<br>-CTF 0 : 1 PIT ','lightgreen')"; ONMOUSEOUT="kill()">4:1</a></span></div></td>
gruss ubunut_lova
Antwort 3 von CSSrules vom 29.10.2019, 14:22 Options
Zitat:
ganz einfaches CSS (onmouseover, onmouseout)
onmouseover und onmouseout sind
event-Handler im JavaScript, haben mit CSS nichts zu tun.
Das im CSS beschriebene Element mit der ID "
dek" finde ich in deinem (suboptimalen) HTML nicht, dort dreht es sich um zwei
JavaScript-Funktionen mit den bezeichnenden Namen
popup und
kill.
Antwort 4 von ubunut_lova vom 29.10.2019, 14:34 Options
ok sorry.. stimmt.. habs gerade gefunden
musste nur ein paar sachen im script abändern... wusste nicht mehr dass es von einem JS abhängig war... sonst hätt ich hier nicht einen solch unnötigen post aufgemacht....
hier noch das JS für solche denen das script gefällt (Quelle: dynamic drive.com)
Xoffset=-60; // modify these values to ...
Yoffset= 20; // change the popup position.
var old,skn,iex=(document.all),yyy=-1000;
var ns4=document.layers
var ns6=document.getElementById&&!document.all
var ie4=document.all
if (ns4)
skn=document.dek
else if (ns6)
skn=document.getElementById("dek").style
else if (ie4)
skn=document.all.dek.style
if(ns4)document.captureEvents(Event.MOUSEMOVE);
else{
skn.visibility="visible"
skn.display="none"
}
document.onmousemove=get_mouse;
function popup(msg,bak){
var content="<TABLE WIDTH=180 BORDER=5 BORDERCOLOR=black CELLPADDING=2 CELLSPACING=0 "+
"BGCOLOR="+bak+"><TD ALIGN=center><FONT COLOR=black SIZE=2px>"+msg+"</FONT></TD></TABLE>";
yyy=Yoffset;
if(ns4){skn.document.write(content);skn.document.close();skn.visibility="visible"}
if(ns6){document.getElementById("dek").innerHTML=content;skn.display=''}
if(ie4){document.all("dek").innerHTML=content;skn.display=''}
}
function get_mouse(e){
var x=(ns4||ns6)?e.pageX:event.x+document.body.scrollLeft;
skn.left=x+Xoffset;
var y=(ns4||ns6)?e.pageY:event.y+document.body.scrollTop;
skn.top=y+yyy;
}
function kill(){
yyy=-1000;
if(ns4){skn.visibility="hidden";}
else if (ns6||ie4)
skn.display="none"
}
//-->
Antwort 5 von CSSrules vom 29.10.2019, 14:57 Options
JavaScripte, die versuchen den Browser anhand der Unterscheidung zwischen
document.all (Internet-Explorer 4) und
document.layers (Netscape 4) zu erkennen gehören nicht weiter verbreitet. Nur mit viel Glück funktioniert solch alter Kram noch halbwegs in den aktuellen Browsern. ZB der Firefox fällt nämlich grundsätzlich unter keine der beiden genannten Gruppen.
Eine moderne Lösung für derartige Fragestellungen ist die sogenannte
Lightbox
Antwort 6 von streezer vom 29.10.2019, 16:02 Options
schön und gut aber um eine kleine tabelle anzuzeigen denke ich dass meine technik völlig ausreicht. bei bildern würde ich dieses lightbox zeug sicher einsetzen...
gibt es denn sonst noch alternativen? denn im IE wird es falsch angezeigt... siehe
anderer thread von mir
Antwort 7 von CSSrules vom 29.10.2019, 16:20 Options
Das was dir dort vorgeschlagen wurde sind CSS-Eigenschaften. Wie diese einzubinden sind findest du hier:
SelfHTML.
Ob das dein Problem lösen würde weiß ich nicht, dazu fehlt mir die Muße, deinen alles andere als guten Quellcode zu analysieren.