zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden hasLayout Problem mit "Ulles" hover Bildergalerie

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 12.03.2008, 00:38
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 11.03.2008
Beiträge: 4
regioprint befindet sich auf einem aufstrebenden Ast
Unglücklich hasLayout Problem mit "Ulles" hover Bildergalerie

Hallo zusammen!
Ich komme eigentlich aus der printwelt und habe html nie geliebt, bis ich als Leseratte zufällig auf ein css-Buch (zengarden) gestoßen bin. Seitdem bin ich fasziniert von den Möglichkeiten und probieren Vieles aus. Am liebsten natürlich in einem echten Projekt. Benutze als css editor noch GoLive.

Die Seite steht unter Alfons Helmer Architekt Ibbenbüren

Ich habe so einiges entwickelt und gemerkt, dass alles gut klappt, bis auf die Umsetzung im IE.
Mit den * hacks habe ich dem IE fixe Bereiche beigebracht.

Beim jetztigen Stand des Projekt bin ich an einer Bildergalerie angelangt, die beim hovern die großen Bilder anzeigt. Angeregt wurde ich durch die webseite von fotolia.com und möchte daher auf window.open und Javascript verzichten.
So habe ich ulles Bildergalerie gefunden und eingebaut. Auch die Modifizierung ging schnell und im FF sieht es so aus wie es soll. Die Beispielseite befindet sich im Menüpunkt "denkmalgeschütze Bauten"

Doch leider merkt sich der IE wohl hasLayout an mir unbekannten Stellen. Ich probiere schon drei Tage herum. Es gibt gleichzeitig mehrere Probleme.:
1.) Das gehoverte Bild lässt sich nicht per Z-Index in die oberste Ebene stellen
2.) Nach dem durchhovern aller Bilder werden die Bilder gar nicht mehr ausgewechselt. Erst nach einen reload der Seite kann man neu beginnen.
3.) Die einzublendende Bildunterschrift erscheint zwar regelmäßig beim hovern, aber nicht unter dem Bild, sondern rechts und unter dem Bild.

Die Fehler sehe ich im IE 6, nicht aber im FF 2. Wenn möglich möchte ich das markup so lassen. Ulles Bildergalerie alleine funktioniert bei mir auch im IE, daher glaube ich dass es an meiner gewählten Verschachtelung liegt. Hat jemand so viel technisches Verständnis, wie man das Ergebis auch für den IE besser hingekommt? Ich hoffe ich habe mich richtig erkären können.
Vielen Dank im Voraus, sollte es klappen.
Gruß regioprint

Geändert von regioprint (12.03.2008 um 23:40 Uhr) Grund: Fehler im Text
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 15.03.2008, 22:55
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 11.03.2008
Beiträge: 4
regioprint befindet sich auf einem aufstrebenden Ast
Standard Z Index geht noch nicht

Habe die meisten Probleme selber gelöst.

Es liegt einfach an der unvorhersehbaren Eigenschaft von Layout in manchen Einstellungen. habe daher das markup ein wenig geändert.

Das Problem, das bleibt, ist die Stapelung, die sich im IE nicht durchführen lässt. Auch wohl aufgrund meiner Verschachtelungen und der Unmöglichkeit den Z-Index für den "dummy-text" tiefer zu bestimmen, als das darüber zu platzierende Bild.

Zur Übersicht habe ich die IE.css eingeführt, in der nur die Formatierungen für die Bildergalerie stehen. Hier müsste es gelingen können, die Z-Stapeliung zu beeinflussen.

Leider weiss ich noch nicht, wie ich hier die Sachen übersichtlicher reinbringen kann. sorry

/* Anfang der Bildergalerie = Sonderangaben für den Internetexplorer*/
* html #Inhalt { margin-left: 20px; position: absolute; z-index: 0; top: 120px; left: 0; overflow: auto }
* html #gallery_position { }
* html #gallery { margin-left: 18px; position: relative; top: 460px; left: 5px; width: 920px; height: 150px }
* html #gallery img { margin: 20px; width: 400px; height: 300px; border: solid 1px #000000 }
* html #gallery a, #gallery a:visited /* kleine Bilder, Rand und Abstand, nebeneinander angeordnet */ { text-decoration: none; width: 100px; height: 75px; float: left; border: solid 1px #000000 }
* html #gallery a span /* große Bilder werden nicht angezeigt hier darf bei witdt und heigt nichts stehen, sonst bekommen wir ungewünschtes LAYOUT */ { display: none }
* html #gallery a span img /* bestimmt die Größe des angezeigten Großen Bildes an */ { width: 400px; height: 300px; margin: 0; border: solid 1px #000000 }
* html #gallery a:hover, #gallery a:focus, #gallery a:activ /* macht beim hovern nur den Rand der kleinen Bilder unsichtbar (weiss) */ { border: solid 1px #ffffff }
* html #gallery a:hover span, #gallery a:focus span, #gallery a:active span /* positioniert das große Bild beim hovern nach oben, Anzeige Block ist zwingend, über z-index wird die Stapelung festgelegt */ { display: block; position: absolute; z-index: 2; top: -335px; left: 375px; width: 402px }
* html #gallery a:focus span, #gallery a:active span { z-index: 1 }
* html .Text_Bild_vor_Umbau { color: #066; font-size: 80%; line-height: 125%; text-align: center; visibility: visible }
* html .Text_Bild_nach_Umbau { color: #066; font-size: 80%; font-weight: 500; text-align: center }
* html .einzeln-rechts { visibility: hidden; position: absolute; z-index: 0; top: 6px; left: 380px; border: ridge 1px #5274fe }
/* Ende der Bildergalerie*/
* html #nav-unten { color: #000; font-size: 0.7em; visibility: visible; position: absolute; top: 580px; left: 500px }
* html #dummy-text { visibility: visible; position: absolute; top: 250px; left: 530px }
* html #dummy-text p { color: gray; font-size: 60%; text-align: left }
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 16.03.2008, 09:40
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

Welches der genannten Probleme ist im Moment im IE6 noch aktuell?

Mit Stapelproblem meinst du, dass der Text "Vergrößerung Bildleiste unten" über dem Bild liegt, oder?
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken
Mit Zitat antworten
  #4 (permalink)  
Alt 16.03.2008, 09:44
Benutzerbild von Boris
Tanzender Webentwickler
XHTMLforum-Kenner
 
Registriert seit: 29.07.2004
Ort: Kornwestheim / Stuttgart
Beiträge: 4.925
Boris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer MenschBoris ist ein sehr geschätzer Mensch
Standard

Erstmal solltest du das hier rausnehmen:
Zitat:
<?xml version="1.0" encoding="iso-8859-1"?>
Das schmeisst den IE6 nämlich in den Quirksmodus, in dem er das CSS Boxmodel falsch interpretiert, womit du dann noch mehr Kummer hast.

Vergiss auch nicht, dass es mittlerweile den IE7 gibt ... schonmal gesehen, wie deine Website in diesem aussieht?

Zitat:
/* 100,01 % ist wichtig für IE bugs, und 0 bei margin und padding ebenfalls */
Nö ... mit margin und padding werden nur die Standardabstände auf 0 gesetzt, das hat nichts mit Fehlern zu tun.
__________________
My software never has bugs. It just develops random features ...

» DevShack - die Website des freien Webentwicklers Boris Bojic
Mit Zitat antworten
  #5 (permalink)  
Alt 16.03.2008, 10:00
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

Zitat:
Zitat von Boris Beitrag anzeigen
Erstmal solltest du das hier rausnehmen:
Das schmeisst den IE6 nämlich in den Quirksmodus
Vielleicht, aber diese Methode des Frame-layouts funktioniert im IE6 nur im Quirksmodus.
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken

Geändert von IChao (16.03.2008 um 10:03 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 17.03.2008, 11:37
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 11.03.2008
Beiträge: 4
regioprint befindet sich auf einem aufstrebenden Ast
Standard Noch aktuelles "Stapelproblem"

Zitat:
Zitat von IChao Beitrag anzeigen
Welches der genannten Probleme ist im Moment im IE6 noch aktuell?

Mit Stapelproblem meinst du, dass der Text "Vergrößerung Bildleiste unten" über dem Bild liegt, oder?
Ja, das meine ich. Eigentlich soll ein Bild statt des Textes permanent zu sehen sein. Wenn man mit dem Mauszeiger unten in der Bildleiste hovert, soll ein neues Bild oben darüber gelegt werden. Das wollte ich mit dem Z-index erreichen, geht aber nicht. Im FF geht es aber.
Mit Zitat antworten
  #7 (permalink)  
Alt 17.03.2008, 11:41
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

Code:
#gallery_position {
position: relative;
z-index: 6;
width: 100%; /*haslayout*/
}
ggfs. z-index anpassen.
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken
Mit Zitat antworten
  #8 (permalink)  
Alt 17.03.2008, 11:45
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 11.03.2008
Beiträge: 4
regioprint befindet sich auf einem aufstrebenden Ast
Standard Quirksmodus!?

[QUOTE=Boris;376563]Erstmal solltest du das hier rausnehmen:
Das schmeisst den IE6 nämlich in den Quirksmodus, in dem er das CSS Boxmodel falsch interpretiert, womit du dann noch mehr Kummer hast.

Vergiss auch nicht, dass es mittlerweile den IE7 gibt ... schonmal gesehen, wie deine Website in diesem aussieht?

Hallo Boris, ich habe die Zeile seinerzeit bewusst eingefügt, damit ich den Quirksmodus bekomme. Grund ist, dass ich dann schon bei mir sehen kann, wie sich die Seite in älteren Browsern darstellt. An den IE 7 hatte ich noch gar nicht gedacht. Ich habe auch bewusst nur den IE 6 auf meinem System, weil ich denke, dass noch nicht Viele und auch nicht schnell auf eine höhere Version umsteigen. Kannst Du mir sagen, ob die Seite im IE 7 passt?
Meinst Du ich sollte den Quirksmodus jetzt wieder generell abstellen?
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Fertiges Drop-Down Menü ins Layout einfügen VoB CSS 6 15.03.2011 17:14
CSS Hover Submenü - Problem in Darstellung des Elternelements DaDom CSS 3 07.03.2011 10:44
:hover Problem im Firefox ulle CSS 14 21.04.2005 17:47
Hover display:block background-color Problem Karsten CSS 2 26.08.2004 13:04
iexplorer 6.0 / mozilla 1.6 css hover problem titze CSS 4 15.08.2004 12:31


Alle Zeitangaben in WEZ +2. Es ist jetzt 11:51 Uhr.