Seite 1 von 3 123 LetzteLetzte
Ergebnis 1 bis 15 von 31
  1. #1
    Apoplexy ist offline Routinier
    registriert
    29-10-2004
    Ort
    NRW
    Beiträge
    267

    Ebene fest positionieren

    Hi,
    ich hab 4 Layer mit Bildern übereinander gelegt, und das erste Bild ist fest positioniert.

    Wenn ich nun die Fenstergröße im Browser verändere, wandern die Layer weg vom Grundbild, auf denen es jedoch bleiben soll.

    Wie kann ich diese Ebenen fest einstellen?

    Gruß,
    Apoplexy

    siehe hier bei: Vielleicht interessieren Sie auch diese Strickanleitungen:

  2. #2
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Ebene fest positionieren

    Dazu sollte man den entsprechenden Quelltextteil sehen...

  3. #3
    Apoplexy ist offline Routinier
    registriert
    29-10-2004
    Ort
    NRW
    Beiträge
    267

    AW: Ebene fest positionieren

    Reicht der Ausschnitt:


    #hoverbild {
    width:150px;
    height:113px;
    padding:4px;
    border:2px solid #0000EE;
    }
    <th rowspan="4" width="200">
    <div id="hoverbild">
    <img src="teller.jpg" width="200" height="113">
    <div id="Layer1" style="position:absolute; width:200px; height:113px; z-index:1; left: 76px; top: 303px;"><img src="bild1.jpg" width="200" height="113" id="bild1" style="visibility:hidden">
    <div id="Layer2" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px;"><img src="bild2.jpg" width="200" height="113" id="bild2" style="visibility:hidden">
    <div id="Layer3" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px;"><img src="bild3.jpg" width="200" height="113" id="bild3" style="visibility:hidden">
    <div id="Layer4" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px"><img src="bild4.jpg" width="200" height="113" id="bild4" style="visibility:hidden">
    </div>
    </div>
    </div>
    </div>

    </div>

    </th>
    </div>

    </th>

    <td width="458"><ul>
    <li><a href="http://www.apoplexy.de/Eierwaermer_Shop/schal_stricken/strickanleitung_schal.htm" onmouseover="document.getElementById('bild1').style.visibility='visible'"; onmouseout="document.getElementById('bild1').style.visibility='hidden'";><font size="2" face="Verdana, Arial, Helvetica, sans-serif">Wie
    stricke ich einen Schal/ Schalmuster</font></a><br>
    </li>
    </ul></td>
    </tr>
    Irgendwas stimmt auch mit dem CSS nicht. Wollte eigentlich kein Padding, nur ein 2px Rahmen rum. Aber unten ist es immer mehr Abstand.

    Gruß,
    Apoplexy
    Geändert von Apoplexy (11-12-2004 um 23:23 Uhr)

  4. #4
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Ebene fest positionieren

    Versuch macht kluch...
    Das Fettgedruckte weg und statt position:absolute relative nehmen...
    Code:
     <th rowspan="4" width="200">
    <div id="hoverbild">
    <img src="teller.jpg" width="200" height="113">
    
    <div id="Layer1" style="position:absolute; width:200px; height:113px; z-index:1; left: 76px; top: 303px;">
    <img src="bild1.jpg" width="200" height="113" id="bild1" style="visibility:hidden">
    
    <div id="Layer2" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px;">
    <img src="bild2.jpg" width="200" height="113" id="bild2" style="visibility:hidden">
    
    <div id="Layer3" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px;">
    <img src="bild3.jpg" width="200" height="113" id="bild3" style="visibility:hidden">
    
    <div id="Layer4" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px">
    <img src="bild4.jpg" width="200" height="113" id="bild4" style="visibility:hidden">
    
    </div>
    </div>
    </div>
    </div>
    
    </div>
    
    </th>

  5. #5
    Apoplexy ist offline Routinier
    registriert
    29-10-2004
    Ort
    NRW
    Beiträge
    267

    AW: Ebene fest positionieren

    Hi,
    das hab ich nicht ganz verstanden. Anstatt die left: 76px; top: 303px;">,etc
    soll ich was nehmen?
    position:absolute ?
    Was bedeutet relative ?


    Hab grad bei SelfHtml geschaut. Also geb ich da position:relative ein.
    Sollte das nicht lieber in den Style oben?

    --------------Edit-------------------------

    Geht nicht, danne erscheinen alle Bilder wieder untereinander, und nicht übereinander.

    <img src="teller.jpg" width="200" height="113">
    <div id="Layer1" style="position:absolute; width:200px; height:113px; z-index:1; position:relative"><img src="bild1.jpg" width="200" height="113" id="bild1" style="visibility:hidden">
    <div id="Layer2" style="position:absolute; width:200px; height:113px; z-index:1; position:relative"><img src="bild2.jpg" width="200" height="113" id="bild2" style="visibility:hidden">
    <div id="Layer3" style="position:absolute; width:200px; height:113px; z-index:1; position:relative"><img src="bild3.jpg" width="200" height="113" id="bild3" style="visibility:hidden">
    <div id="Layer4" style="position:absolute; width:200px; height:113px; z-index:1; position:relative"><img src="bild4.jpg" width="200" height="113" id="bild4" style="visibility:hidden">
    </div>
    </div>
    </div>
    </div>
    Bessere Idee?
    Danke,
    Apoplexy
    Geändert von Apoplexy (11-12-2004 um 23:54 Uhr)

  6. #6
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Ebene fest positionieren

    Kommando zurück... :whacky:

    Wenn Du bei der absoluten Positionierung absolute Angaben benutzt (px),
    ist es klar, dass sich die Pics verschieben,
    da sie sich nach dem "Browserrand" richten.
    Du solltest das so ausexperimentieren, dass es mit Prozentangaben funktioniert.
    Bsp.:
    Code:
    left:7%; top:30%;

  7. #7
    Apoplexy ist offline Routinier
    registriert
    29-10-2004
    Ort
    NRW
    Beiträge
    267

    AW: Ebene fest positionieren

    Jeppp...das klingt gut. Danke!


    Apoplexy

  8. #8
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Ebene fest positionieren

    Probier's erstmal aus...
    Ohne Gewähr...

  9. #9
    Avatar von Albu
    Albu ist offline Foren-Gott
    registriert
    04-07-2001
    Beiträge
    13.501

    AW: Ebene fest positionieren

    öhm.... nur mal so ein kleiner Einwurf:

    Du solltest erstmal Deine Verschachtelungen auseinander dividieren, Deine DIVs sollten einem Vater Element untergeordnet sein, auf dessen Position sich dann das position:absolute oder relative bezieht. Sobald DIVs verschachtelt sind wirkt die Positionierung nämlich ausgehend vom Vaterelement (Auch wenn Du ein Top Level DIV hast, welches direkt im Body steht, wirkt sich die Position auf das Vaterelement aus, in diesem Fall eben BODY!!).
    Desweiteren ist von der Vermischung von Tabellen und DIVs extremst abzuraten. Entweder Tabellen oder DIVs, Tabellen in DIVs geht noch, DIVs in Tabellen großes NO-NO!
    1. Get people to play Space Taxi
    2. Sell real estates on neptun
    3. Profit!

    IE is not a browser, it is a scream.


    Outside of a dog, a book is man's best friend. Inside of a dog, it's too dark to read.

  10. #10
    Apoplexy ist offline Routinier
    registriert
    29-10-2004
    Ort
    NRW
    Beiträge
    267

    AW: Ebene fest positionieren

    @dkdenz:
    Leider wandert es immer noch mit, oder hab ich was falsch verstenden?

    <div id="Layer1" style="position:absolute; width:200px; height:113px; z-index:1; left:6%; top:69%;"><img src="bild1.jpg" width="200" height="113" id="bild1" style="visibility:hidden">

    Ciao
    APoplexy

    @ albu:
    leider hab ich nun nicht verstanden, wie es besser wäre.
    Kannst du mir ein beispiel zur Veranschaulichung geben.

    Danke,
    Apoplexy

  11. #11
    Avatar von dkdenz
    dkdenz ist offline Foren-Gott
    registriert
    13-04-2004
    Ort
    Lübeck
    Beiträge
    12.050

    AW: Ebene fest positionieren

    Albu hat natürlich recht.
    Ist mir gar nicht aufgefallen *schäm*...
    Du solltest erstmal Ordnung schaffen.
    Code:
    <th rowspan="4" width="200">
    <div id="hoverbild">
    <img src="teller.jpg" width="200" height="113">
    </div>
    </th>
    
    <div id="Layer1" style="position:absolute; width:200px; height:113px; z-index:1; left: 76px; top: 303px;"><img src="bild1.jpg" width="200" height="113" id="bild1" style="visibility:hidden"></div>
    
    <div id="Layer2" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px;"><img src="bild2.jpg" width="200" height="113" id="bild2" style="visibility:hidden"></div>
    
    <div id="Layer3" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px;"><img src="bild3.jpg" width="200" height="113" id="bild3" style="visibility:hidden"></div>
    
    <div id="Layer4" style="position:absolute; width:200px; height:113px; z-index:1; left: 0px; top: 0px"><img src="bild4.jpg" width="200" height="113" id="bild4" style="visibility:hidden"></div>
    Da Du ja schon mal angefangen hast divs in tables zu packen,
    wird es wohl zu umfangreich, alles nochmal neu zu strukturieren.
    Aber die divs in denen Du einen z-index angegeben hast,
    kannst Du frei "schweben" lassen.
    Jetzt musst Du mit den Werten top und left rumexperimentieren.
    Und das in ALLEN divs und nicht nur im Ersten so wie in Deinem Beispiel.

  12. #12
    Apoplexy ist offline Routinier
    registriert
    29-10-2004
    Ort
    NRW
    Beiträge
    267

    AW: Ebene fest positionieren

    Hi dkdenz,
    danke schon mal dafür.

    Hatte nur mit der ersten gestestet, aber da sich das erste Bilf nicht festgesteszt hatte, hatte ich auch aufgegeben. Vielleicht liegt es ja daran, das es mit left und top ein Problem ist, weil ich Frames benutze. Oder leigt ich da falsch?

    Ciao
    Apoplexy

  13. #13
    Apoplexy ist offline Routinier
    registriert
    29-10-2004
    Ort
    NRW
    Beiträge
    267

    AW: Ebene fest positionieren

    Hi,
    hätte jetzt gern mal erstmal Ordnung geschafft, aber es klappt nicht. Es scheitert hier ran, wenn ich dies übernehme:
    <th rowspan="4" width="200">
    <div id="hoverbild">
    <img src="teller.jpg" width="200" height="113">
    </div>
    </th>
    Das End-tag </th> muß am Ende bleiben.

    So klappt es aber:

    <th rowspan="4" width="200">
    <div id="hoverbild">
    <img src="teller.jpg" width="200" height="113"> </div>
    <div id="Layer1" style="position:absolute; width:200px; height:113px; z-index:1; left:6%; top:69%;"><img src="bild1.jpg" width="200" height="113" id="bild1" style="visibility:hidden"> </div>
    <div id="Layer2" style="position:absolute; width:200px; height:113px; z-index:1; left:6%; top:69%;"><img src="bild2.jpg" width="200" height="113" id="bild2" style="visibility:hidden"> </div>
    <div id="Layer3" style="position:absolute; width:200px; height:113px; z-index:1; left:6%; top:69%;"><img src="bild3.jpg" width="200" height="113" id="bild3" style="visibility:hidden"> </div>
    <div id="Layer4" style="position:absolute; width:200px; height:113px; z-index:1; left:6%; top:69%;"><img src="bild4.jpg" width="200" height="113" id="bild4" style="visibility:hidden"> </div>

    </th>

    Ich vemute, ich hab mir falsch ausgedrückt, mit dem Schweben .
    Wenn ich die browsergröße des Fensters/Seite minimiere, wandert das bild, bzw. alle die, die denb Rollover Effekt haben an eine andere Stelle. Und genau diese sollen fest positioniert bleiben. Auch wenn ich alle 4 bilder mit % von left & top eingebe, bleiben sie nicht an der Stelle verwachsen Gibt es da keinen Trick?
    Bin zwar am experimentieren, aber was nutzen mich die Abänderungen der Ziffern. Sobald ich die Seite minimiere, ist das Bild woanders.

    Danke schonmal,
    Apoplexy

  14. #14
    Apoplexy ist offline Routinier
    registriert
    29-10-2004
    Ort
    NRW
    Beiträge
    267

    AW: Ebene fest positionieren

    Geschafft

  15. #15
    leixe ist offline Grünschnabel
    registriert
    22-02-2005
    Beiträge
    3

    AW: Ebene fest positionieren

    Wie hast du es geschaft was hast du gemacht.
    Ich hab son ähnliches problem und zwar mit ebenen. Das mit dem Prozent hat mir nur zum teil funktioniert.
    Ich habe eine Seite mit zwei Texten und einem Bild, also drei ebenen. Sobald ich die auflösung ändere verschieben sich auch die bilder und die texte. Kann mir vieleicht auch jemand helfen.

Seite 1 von 3 123 LetzteLetzte

Ähnliche Themen

  1. Antworten: 7
    Letzter Beitrag: 29-09-2004, 09:36
  2. Ebene mitrutschen lassen
    Von jump.blueberry im Forum JavaScript
    Antworten: 3
    Letzter Beitrag: 02-07-2004, 15:54
  3. Antworten: 2
    Letzter Beitrag: 28-05-2003, 18:08
  4. Ebene fest positionieren?
    Von Unregistered im Forum JavaScript
    Antworten: 0
    Letzter Beitrag: 09-03-2001, 18:07

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •