Antworten auf deine Fragen:
Neues Thema erstellen

Positionierung von img in div funktioniert nicht

synth

Aktives Mitglied

Hallo Ihr Lieben,
nachdem mir jmd. hier den Floh ins Ohr gesetzt hat, ich könnte die Bilder so wie ich will in DIV-Containern positionieren bin ich am probieren, komme aber nicht zum gewünschten Ergebnis.

Beispiel-Link: www.webyouth.de/F_L/

Ihr seht eine exemplarische Galerie, mit zwei Bildern. Ein Bild liegt im Hochformat vor und eines im Querformat. Links beim Überfahren der Voransichtsbilder (ggf. etwas warten) werden rechts die großen Bilder eingeblendet. Diese erscheinen in einem 600x600 großen Div-Container.
Die Positionierung im Div-Container sollte vertikal und horizontral zentriert sein, wie aber am querformatigen Bild zu sehen ist, die Positionierung funktioniert nicht.

Getestet mit aktuellem FF und IE64bit.

Hab ich irgendeinen Fehler drin?
Ich weiss gerade nicht mehr wonach ich suchen soll.

THNX, LG synth

EDIT: nicht wundern ... drei hier unerhebliche Bilder fehlen ... ist ok so, weil nur "Designelemente".
 
Zuletzt bearbeitet:

sokie

Mod | Web

AW: Positionierung von img in div funktioniert nicht

wenn ich eine Box habe die 600x600 gross ist und jedes darin angezeigte Bild horizontal und vertikal zentriert dargestellt werden soll, würde ich das jeweilige Bild als background-image anzeigen lassen.
so kannst du für die box grundsätzlich festlegen:
Code:
#box{
height: 600px;
width: 600px;
background-position: center center;
background-color: transparent;
background-repeat: no-repeat;
}
dann brauchst du nur die Eigenschaft 'background-image' per javascript mit dem anzuzeigenden Bild belegen
 

synth

Aktives Mitglied

AW: Positionierung von img in div funktioniert nicht

dann brauchst du nur die Eigenschaft 'background-image' per javascript mit dem anzuzeigenden Bild belegen

Alles vorher hab ich glaube ich kapiert, Danke ... aber wie belege ich das Bild via JS mit einer Eigenschaft?
THNX, LG synth
 

timmeythe1st

nichtswissender

AW: Positionierung von img in div funktioniert nicht

du greifst per js auf die eigenschaft background-image von #box zu:
Code:
<script>
  document.getElementById("box").style.backgroundImage = "dein_bild.jpg";
</script>
es gibt verschiedene möglichkeiten, per js auf elemente zuzugreifen, sieh diese hier also einfach als exemplarisches beispiel, welche noch auf deine situation angepasst werden muss
ausserdem habe ich dies noch nicht getestet, es könnten also evtl. noch schreibfehler oder dergleichen versteckt sein ;)
 

Myhar

Hat es drauf

AW: Positionierung von img in div funktioniert nicht

Code:
<script>
  document.getElementById("box").style.backgroundImage = "dein_bild.jpg";
</script>

Da gibt es ja auch zwei Möglichkeiten, das umzusetzen.
wie du es schon hier geschrieben hast und
Weiß jemand von euch eigentlich, ob eine der beiden Methoden der anderen vorzuziehen ist? Ich verwende eigentlich auch immer die erste, aber vielleicht gibt es ja einen triftigen Grund, Methode 2 zu verwenden?

L. G.
 

Zampano_

Nicht mehr ganz neu hier

AW: Positionierung von img in div funktioniert nicht

Naja, steht doch im Text von "Einerseits so":

"Leider unterstützt Internet Explorer 6 setAttribute ausgerechnet für das Setzen des Attributs style nicht, so dass plattformunabhängige Skripte auf die Methode node.style.cssEigenschaft = "" zurückgreifen müssen."
 

Myhar

Hat es drauf

AW: Positionierung von img in div funktioniert nicht

Danke für den Hinweis. Jaja, man sollte Texte auch ganz durchlesen und nicht nur überfliegen *g*

L. G.
 

sokie

Mod | Web

AW: Positionierung von img in div funktioniert nicht

bei einerseits oder andererseits wäre die Eigenschaft aber doch "url(dein_bild.jpg)" oder?
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.614
Beiträge
1.538.351
Mitglieder
67.525
Neuestes Mitglied
mgtaucher
Oben