Der folgende Beitrag wurde am 08. 02. 2007, 10:16 Uhr von Martin Domdey veröffentlicht.
Hallo!
Ich habe auf einer Seite ein Bild mittels CSS-Klasse auf eine bestimmte Stelle fest definiert:
.imgsys { background-color: #ffffff; border: 2px ridge #ffffff; position: absolute; right: 25px; top: 158px; }
Wenn bei größerem Inhalt jedoch auf der rechten Seite eine Scrollbar auftaucht, überdeckt das Bild halb die Scrollbar. Weiter links möchte ich das Bild aber nicht definieren, denn so würde es wiederum nicht gut aussehen, wenn bei weniger Inhalt keine Scrollbar vorhanden ist.
Meine Frage: Gibt es eine Möglichkeit, dass Bild bei Auftauchen einer Scrollbar rechts etwas weiter nach links zu verschieben? Mit CSS würde das bestimmt nicht gehen, aber mit JavaScript vielleicht?
Die Frage ist mir deshalb entstanden, weil ich diese CSS-Klasse für mehrere Seiten nutze, auf einer aber mehr Inhalt und demnach eine Scrollbar und bei einer anderen weniger Inhalt und keine Scrollbar vorhanden ist. Mit zwei Klassen zu arbeiten, wäre auch möglich - ich möchte aber, dass automatisch erkannt wird, wann eine Scrollbar erscheint und wann nicht, um dann das Bild entweder weiter links oder an jetziger Stelle zu platzieren.
Kann mir da jemand weiterhelfen?
Danke schon mal, Martin...
Der folgende Beitrag wurde am 08. 02. 2007, 10:27 Uhr von wahsaga veröffentlicht.
hi,
> .imgsys { background-color: #ffffff; border: 2px ridge #ffffff; position: absolute; right: 25px; top: 158px; }
>
> Wenn bei größerem Inhalt jedoch auf der rechten Seite eine Scrollbar auftaucht, überdeckt das Bild halb die Scrollbar.
Wie das?
Das ist normalerweise nicht möglich.
Es sei denn, du meinst nicht die Scrollbar des Elements, in dem du das Bild positioniert hast, sondern die eines anderen Elements, bspw. bei einem position-fixed-Workaround für ältere IE.
gruß,
wahsaga
--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
Der folgende Beitrag wurde am 08. 02. 2007, 11:04 Uhr von Martin Domdey veröffentlicht.
> Es sei denn, du meinst nicht die Scrollbar des Elements, in dem du das Bild positioniert hast, sondern die eines anderen Elements, bspw. bei einem position-fixed-Workaround für ältere IE.
>
Richtig, das Bild gehört nicht zum selben Element und kann/darf daher die Scrollbar überdecken. Nur, wie kann ich jetzt mein Problem lösen. Hast Du da eine Idee?
Danke schon mal, Martin...
Der folgende Beitrag wurde am 08. 02. 2007, 11:19 Uhr von wahsaga veröffentlicht.
hi,
> Richtig, das Bild gehört nicht zum selben Element und kann/darf daher die Scrollbar überdecken. Nur, wie kann ich jetzt mein Problem lösen.
Welches Problem - wenn es doch "kann/darf"?
gruß,
wahsaga
--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
Der folgende Beitrag wurde am 08. 02. 2007, 11:50 Uhr von Martin Domdey veröffentlicht.
> hi,
>
> > Richtig, das Bild gehört nicht zum selben Element und kann/darf daher die Scrollbar überdecken. Nur, wie kann ich jetzt mein Problem lösen.
>
> Welches Problem - wenn es doch "kann/darf"?
Mit "kann/darf" meine ich, dass es möglich ist. Jedoch ist der Effekt nicht erwünscht. Wenn in dem anderen Element eine Scrollbar erscheint, soll einfach nur das Bild ein Stück weiter nach links weichen. Ist das möglich, mit CSS oder JavaScript - und wenn, wie nur?
Danke, Martin...
Der folgende Beitrag wurde am 08. 02. 2007, 12:19 Uhr von wahsaga veröffentlicht.
hi,
> Wenn in dem anderen Element eine Scrollbar erscheint, soll einfach nur das Bild ein Stück weiter nach links weichen. Ist das möglich, mit CSS oder JavaScript - und wenn, wie nur?
Über Vergleich von scrollHeight mit offsetHeight o.ä. könnte man vielleicht dynamisch ermitteln, ob der Elementinhalt zu Scrollbalken führt.
gruß,
wahsaga
--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
Der folgende Beitrag wurde am 08. 02. 2007, 13:49 Uhr von Martin Domdey veröffentlicht.
> hi,
>
> > Wenn in dem anderen Element eine Scrollbar erscheint, soll einfach nur das Bild ein Stück weiter nach links weichen. Ist das möglich, mit CSS oder JavaScript - und wenn, wie nur?
>
> Über Vergleich von scrollHeight mit offsetHeight o.ä. könnte man vielleicht dynamisch ermitteln, ob der Elementinhalt zu Scrollbalken führt.
>
> gruß,
> wahsaga
>
>
Nun, danke erstmal!
Aber ich fürchte, ich stelle mich dazu zu blöd an. Also der Inhalt steht im Quelltext in einem div-Tag. Muss ich das JavaScript jetzt in diesen div-Tag mit einfügen, damit ich mit scrollHeight die Höhe des Textes in diesem div-Tag ermitteln kann. Ich komme einfach auf keine vernünftige Syntax. Wie muss ich denn ScrollHeight anwenden?
Grüße, Martin...
Der folgende Beitrag wurde am 08. 02. 2007, 14:00 Uhr von wahsaga veröffentlicht.
hi,
> Aber ich fürchte, ich stelle mich dazu zu blöd an. Also der Inhalt steht im Quelltext in einem div-Tag. Muss ich das JavaScript jetzt in diesen div-Tag mit einfügen,
Nein, du kannst Javascript an vielen Stellen im Dokument einfügen.
Ggf. musst du aber vor dem Zugriff auf Objekte abwarten, bis diese existieren - Stichwort onload-Handler.
> damit ich mit scrollHeight die Höhe des Textes in diesem div-Tag ermitteln kann. Ich komme einfach auf keine vernünftige Syntax. Wie muss ich denn ScrollHeight anwenden?
Grundlagenwissen in Javascript dürfen wir wohl voraussetzen.
Und scrollHeight ist dann lediglich eine Objekteigenschaft.
gruß,
wahsaga
--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
Der folgende Beitrag wurde am 08. 02. 2007, 14:36 Uhr von Martin Domdey veröffentlicht.
Ich krieg das aber nicht ganz so hin.
Ich habe jetzt in den Quelltext geschrieben:
<body onLoad="h()">
und in den <div>-Tag:
<script type="text/javascript">
function h() {
alert(document.body.scrollHeight);
alert(document.body.offsetHeight); }
</script>
Erst mal nur, um die Werte per alert auszulesen - aber egal, wie ich den Textinhalt im <div>-Tag ändere, wird mir immer scrollHeight = 575 und offsetHeight = 579 ausgegeben. Die Werte müssten sich aber ändern. Ich bin mir auch nicht sicher, ob "body" in der alert-Klammer korrekt ist: ich beziehe mich ja nur auf den <div>-Tag und nicht auf den ganzen body.
Was habe ich falsch gemacht?
Grüße, Martin...
Der folgende Beitrag wurde am 08. 02. 2007, 15:00 Uhr von wahsaga veröffentlicht.
hi,
> Ich bin mir auch nicht sicher, ob "body" in der alert-Klammer korrekt ist: ich beziehe mich ja nur auf den <div>-Tag und nicht auf den ganzen body.
Du meinst: Du beziehst dich auf body, willst dich aber auf den Div beziehen?
Dann mach das.
gruß,
wahsaga
--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
Der folgende Beitrag wurde am 08. 02. 2007, 15:10 Uhr von Martin Domdey veröffentlicht.
warum werden mir bei beiden alerts eigentlich immer dieselben Werte ausgegeben, auch wenn ich den Text im div-Tag beliebig verändere?
Der folgende Beitrag wurde am 08. 02. 2007, 15:31 Uhr von wahsaga veröffentlicht.
hi,
> warum werden mir bei beiden alerts eigentlich immer dieselben Werte ausgegeben, auch wenn ich den Text im div-Tag beliebig verändere?
Erzeugt der div-Inhalt denn einen Scrollbalken für body?
gruß,
wahsaga
--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
Der folgende Beitrag wurde am 08. 02. 2007, 16:13 Uhr von Martin Domdey veröffentlicht.
Der div-Inhalt steht in einer Tabellenzelle, wird der Inhalt zu lang für die Zelle erscheint ein Scrollbalken nur an dieser Zelle, laut CSS: overflow:auto;
Das Bild habe ich an anderer Stelle in den Quelltext geschrieben, gleich unter <body>
<table class="imgsys">
<tr>
<td>
<img src="../../../images/system/acheta.jpg" width="137" height="94">
</td>
</tr>
</table>
mit der CSS-Klasse:
.imgsys { background-color: #ffffff; border: 2px ridge #ffffff; position: absolute; right: 25px; top: 158px; }
Was muss ich denn in die alert-Klammer schreiben, dass er die Länge NUR des div-Inhalts ausliest.
Grüße, Martin...
Der folgende Beitrag wurde am 08. 02. 2007, 17:12 Uhr von wahsaga veröffentlicht.
hi,
> Was muss ich denn in die alert-Klammer schreiben, dass er die Länge NUR des div-Inhalts ausliest.
Na was wohl - du musst die Eigenschaft des Divs abfragen.
Solche Javascript-Grundkenntnisse wie den Zugriff auf Elemente darf man doch wohl eigentlich voraussetzen - document.getElementById & Co. beispielsweise.
gruß,
wahsaga
--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
Der folgende Beitrag wurde am 08. 02. 2007, 17:37 Uhr von Martin Domdey veröffentlicht.
Manchmal hab ich echt so'n Brocken vor der Nase...
Natürlich, getElementById!!! Warum bin ich da nicht selbst drauf gekommen???
Okay, vielen Dank, Martin
© 1998-2013 SELFHTMLImpressumSoftware: Classic Forum 3.4