Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen (A bis Z)

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

CSS - Galerieprobleme im IE

Frage Entwicklung HTML

Mitglied: ooAlbert

ooAlbert (Level 1) - Jetzt verbinden

11.05.2010 um 18:38 Uhr, 3124 Aufrufe, 3 Kommentare

Hallo,

ich hab möchte ganz gern in einer Webseite eine kleine Galerie haben die nur mit CSS funktioniert. Nach einigem Suchen hab ich unteranderem das gefunden: http://www.dynamicdrive.com/style/cs...-image-viewer/

Ich muss dazusagen, das meine Thumbs in einem Block angeordnet sind, so das das Hover-bild über den anderen Thumbs liegen würde. Im FF3 funktioniert das auch alelws ganz gut aber im IE8 sind die Thumbs immer über dem Hover-Bild. Das Attribut "Z-Index" hat nichts bewirken können.

Das Hoverbild liegt nur dann über allen Ebenen, wenn man das Thumb im IE klickt.

Kann man das irgendwie umgehen oder muss für den IE irgendwas speziell angepasst werden?

mfg
Mitglied: mrtux
11.05.2010 um 19:12 Uhr
Hi !

Was Du benötigst ist eine so genannte Browserweiche. Vielleicht wäre es besser, wenn Du dich in das Thema CSS einarbeitest. Wie die unterschiedlichen Browser bei CSS reagieren und wo die Unterschiede genau liegen, kannst Du hier nachlesen. Auf dieser Seite gibt es auch Tutorials zu dem Thema, die (meiner Meinung nach) sehr hilfreich sind.

mrtux
Bitte warten ..
Mitglied: knut4linux
11.05.2010 um 20:17 Uhr
Mahlzeit,

ja, der IE8. Ich liebe Ihn. Ich habe auch schon so einige Probleme mit ihm gehabt. Aber egal. Was ich vermute:

- problem mit nem DIV Container
- im Style das " ; " nach einem parameter vergessen (mag der IE8 nicht)
- wie definierst du die Position des Hover-Bildes (fixe, relative, absolute...?)


Gruß, Knut
Bitte warten ..
Mitglied: ooAlbert
12.05.2010 um 12:38 Uhr
Hi,

ich kopier mal das CSS hierhin, das ist auch soweit noch das, was im vorherigen Link steht:

01.
  
02.
#galerie { 
03.
position:absolute; 
04.
top:155px; 
05.
left:300px; 
06.
width:425px; 
07.
height:290px; 
08.
09.
 
10.
.thumbnail{ 
11.
position: relative; 
12.
z-index: 1; 
13.
float:left; 
14.
15.
 
16.
.thumbnail:hover{ 
17.
background-color: transparent; 
18.
z-index: 50; 
19.
20.
 
21.
.thumbnail span{ /*CSS for enlarged image*/ 
22.
position: absolute; 
23.
background-color: lightyellow; 
24.
padding: 5px; 
25.
left: -1000px; 
26.
border: 1px dashed gray; 
27.
visibility: hidden; 
28.
color: black; 
29.
text-decoration: none; 
30.
31.
 
32.
.thumbnail span img{ /*CSS for enlarged image*/ 
33.
border-width: 0; 
34.
padding: 2px; 
35.
36.
 
37.
.thumbnail:hover span{ /*CSS for enlarged image on hover*/ 
38.
visibility: visible; 
39.
top: 0; 
40.
left: 60px; /*position where enlarged image should offset horizontally */ 
41.
}
Das HTML sieht so aus:
01.
	<div ID="galerie"> 
02.
		Text 
03.
		<a class="thumbnail" href="#thumb"> 
04.
			<img src="galerie/thumb/t1.jpg" border="0" /> 
05.
				<span> 
06.
					<img src="galerie/b1.jpg" /><br /> 
07.
						Text 1 
08.
				</span> 
09.
		</a> 
10.
		<a class="thumbnail" href="#thumb"> 
11.
			<img src="galerie/thumb/t2.jpg" border="0" /> 
12.
				<span> 
13.
					<img src="galerie/b2.jpg" /><br /> 
14.
						Text 1 
15.
				</span> 
16.
		</a> 
17.
	</div>
Die Bilder sind wie gesagt nebeneinander bis die Grenze des DIV erreicht wird und brechen dann auf die nächste Zeile um, das es letztendlich aussieht wie ein Bilder-Block

Ich hab grad mal in einer VM den IE7 probiert und da erscheint alles wie gewünscht,demnach scheint das wirklich ein IE8 Problem zu sein wobei ich nicht verstehe wieso, oder liegt das vielleicht an Windows7 64Bit?

mfg
Bitte warten ..
Ähnliche Inhalte
CSS
Silbentrennung in CSS

Frage von honeybee zum Thema CSS ...

Entwicklung
gelöst IOS WebApp lädt CSS nicht mit (2)

Frage von maddig zum Thema Entwicklung ...

CSS
gelöst CSS: Menü ein- und ausblenden (6)

Frage von honeybee zum Thema CSS ...

Suse
gelöst SquidGuard filtert CSS (3)

Frage von killtec zum Thema Suse ...

Neue Wissensbeiträge
Sicherheit

How I hacked hundreds of companies through their helpdesk

Information von SeaStorm zum Thema Sicherheit ...

Erkennung und -Abwehr

Ccleaner-Angriff war nur auf große Unternehmen gemünzt

(10)

Information von Lochkartenstanzer zum Thema Erkennung und -Abwehr ...

Sicherheit

Eventuell neue Lücke in Intels ME

Information von sabines zum Thema Sicherheit ...

Heiß diskutierte Inhalte
Humor (lol)
Freidach Beitrag (35)

Frage von Penny.Cilin zum Thema Humor (lol) ...

Windows 7
SSD - Win7 Lags (19)

Frage von ph5555 zum Thema Windows 7 ...