mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: So 11.12.2016 09:31 Benutzername: Passwort: Auto-Login

Thema: Positionsbestimmung (absolute) von IMG-Elementen im IE 6.0 vom 01.12.2004


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Positionsbestimmung (absolute) von IMG-Elementen im IE 6.0
Autor Nachricht
J.C.VIPer
Threadersteller

Dabei seit: 29.11.2004
Ort: -
Alter: -
Geschlecht: -
Verfasst Mi 01.12.2004 18:13
Titel

Positionsbestimmung (absolute) von IMG-Elementen im IE 6.0

Antworten mit Zitat Zum Seitenanfang

Hallo,
ich habe gerade ein massives Problem:
Und zwar will ich ein absolut positionierbares Element (<div style="position: absolute">)
relativ zu einem ganz normalen IMG positionieren.
Im Mozilla 1.7 klappt das auch problemlos, allerdings habe ich im IE verschiedene Probleme:
1. Der IE fügt einen magischen Rand von 2px ein?!
2. Der IE beachtet nicht die Ränder von DIV- Elementen, welche das IMG- Tag umgehen.

Der HTML Code sieht schematisch so aus:

<div class="class1"> <!--css: border-left-width: 2px-->

<div class="class2">
<img src="bla" />
</div>
</div>

Ich bestimme die Position des IMG Elements mithilfe folgender Methode

function getAbsolutePosition(){

var offset = this;
var offsetLeft, offsetTop;
while(offset){
offsetLeft = offset.offsetLeft;
offsetTop = offset.offsetTop;
offset = offset.offsetParent;
}
}
Habe auch versucht, an das Style-Objekt des jeweiligen Offsets ranzukommen (offset.style.borderTopWidth bzw. offset.style.borderLeftWidth), allerdings scheint dies nicht zu funktionieren, da meine CSS Deklarationen in einer eigenen Datei ausgelagert sind. Wenn jemand weiß, wie ich daran kommen könnte, wäre ich auch schon überglücklich!

Vielen Dank schon mal für eure Hilfe!

Viele Grüsse

Jochen Wilhelm
  View user's profile Private Nachricht senden
Account gelöscht


Ort: -
Alter: -
Verfasst Mi 01.12.2004 22:14
Titel

Antworten mit Zitat Zum Seitenanfang

Poste einmal den ganzen Quelltext, damit ich mir ein Bild von der Problematik machen kann. Oder nen Screenshot. Ein Bild sagt mehr als tausend WOrte!
 
Anzeige
Anzeige
J.C.VIPer
Threadersteller

Dabei seit: 29.11.2004
Ort: -
Alter: -
Geschlecht: -
Verfasst Do 02.12.2004 08:07
Titel

Antworten mit Zitat Zum Seitenanfang

Hi zuerst einmal vielen Dank für deine Antwort.
Allerdings habe ich keinen Webserver da, deshalb kann ich leider kein Bild einfügen *Schnief* und die Seite ist u.a. auch wegen dem besagten Problem noch offline.

Vielleicht hilft es euch weiter, wenn ich mal den css-code von class1 & class 2 poste:
.class1{
width: 100%;
margin: 1% 0% 1% 0%;
padding: 1%;

color: #225A8D;

font-family: Arial,Helvetica,sans-serif;
font-size: 12pt;
font-weight: bold;

border-top: 4px solid #225A8D;
border-bottom: 2px solid #DCE3EC;
border-left: 2px solid #DCE3EC;
border-right: 2px solid #DCE3EC;
}
.class2{
width: 100%;
margin: 1% 0% 1% 0%;
padding: 1%;

color: #225A8D;

font-family: Arial,Helvetica,sans-serif;
font-size: 12pt;
font-weight: bold;

border-top: 2px solid #225A8D;
border-bottom: 1px solid #DCE3EC;
border-left: 1px solid #DCE3EC;
border-right: 1px solid #DCE3EC;
}

Zwei div-Elemente mit diesen Klassen umgeben mein Bild und ich habe die Erfahrung gemacht, dass die Werte für border-top und border-left das Problem darstellen, da diese bei meiner Funktion getAboslutePosition nicht berücksichtigt werden, mein Bild aber sehr wohl verschieben. Leider habe ich keine Möglichkeit gefunden auf die style Attribute der zwei DIV-Elemente, die ich in der While-Schleife durch offset.offsetParent bekomme, zuzugreifen. Ich habe die Vermutung, dass dies daran liegen könnte, dass meine Styles in einer extra Datei ausgelagert sind.

Ich hoffe, dass hilft euch wenigstens ein bisschen weiter, bei Bedarf kann ich auch ein Screenshot per Mail zuschicken.

Vielen Dank!

Viele Grüsse
Jochen

P.S. Wer ne Lösung für mein Problem hat, wird mein persönlicher Held des Tages, nein besser der Woche *zwinker*!
  View user's profile Private Nachricht senden
J.C.VIPer
Threadersteller

Dabei seit: 29.11.2004
Ort: -
Alter: -
Geschlecht: -
Verfasst Do 02.12.2004 08:50
Titel

Antworten mit Zitat Zum Seitenanfang

Eureca, oder so ähnlich Lächel!

Hab die Lösung!!

Das entsprechende propertie ist clientLeft und clientTop und gibt die Differenz zwischen dem "richtigen" linken Rand und dem offsetLeft /Top an.
Sorry für all die umstände.
Aber vielleicht hilft es ja jemanden, der mal das gleiche Problem zu haben scheint, wie ich!

Viele Grüsse
Jochen
  View user's profile Private Nachricht senden
Account gelöscht


Ort: -
Alter: -
Verfasst Do 02.12.2004 09:56
Titel

Antworten mit Zitat Zum Seitenanfang

Na dann, muss ich mein Hirn nicht einschalten, um so besser Grins
 
 
Ähnliche Themen was ist besser? background-img oder img stretchen?
img {border: 0;} oder img {border: none;}
CSS - Positionierung von Elementen
(css) positionierung von elementen
Datentype von $_REQUEST Elementen ermitteln
p-elementen zentrale Klasse zuweisen
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.