nicht angemeldet
Hilfe für Slideshow
0 0 
Matthias Apsel
Hilfe für Slideshow
Guten Abend.
Ich hoffe das mir vieleicht jemand von den HTML Profis helfen kann. Den folgenden HTML Text habe ich mir von einer Seite geholt(die ich leider nicht mehr finde).
Die horizontale Slideshow funktioniert im Firefox einwandfrei. Bei Safari und Chrome bleibt aber der Slider unter den Bilder unsichtbar. Kann mir ev. jemand sagen wo der Fehler liegt?
div style="width:100%; height: 575px; overflow:auto; font-family: Arial; font-size: 12px; color:transparent; background:transparent;" align="justify">
<div style="width:7320px; height:550px; margin-left:7px;">
<style type="text/css">
.scrollimg {
border-width:0px;
border-color:#ffffff;
border-style:solid;
margin-top:5px;
margin-left:7px;
margin-right:7px;
}
img.horizontal {
width: 825px;
height:550px;
}
img.vertical {
width: 367px;
height:550px;
}
</style>
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild1.jpg">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild2.jpg">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild3.jpg">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild4.jpg">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild5.jpg" style="width:550px; height:550px;">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild6.jpg">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild7.jpg" style="width:550px; height:550px;">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild8.jpg" style="width:550px; height:550px;">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild9.jpg">
<img class="scrollimg horizontal" src="http://horizontalgallerys.herzig-fiechter.ch/misc/Bild10.jpg" style="width:550px; height:550px;">
</div>
</div>
-
Hallo Marco,
Die horizontale Slideshow funktioniert im Firefox einwandfrei. Bei Safari und Chrome bleibt aber der Slider unter den Bilder unsichtbar. Kann mir ev. jemand sagen wo der Fehler liegt?
div style="width:100%; height: 575px; overflow:auto; font-family: Arial; font-size: 12px; color:transparent; background:transparent;" align="justify">
<div style="width:7320px; height:550px; margin-left:7px;">zur Zeit solltest Du folgendes:
<style type="text/css">
.scrollimg {
border-width:0px;
border-color:#ffffff;
border-style:solid;
margin-top:5px;
margin-left:7px;
margin-right:7px;
}
img.horizontal {
width: 825px;
height:550px;
}
img.vertical {
width: 367px;
height:550px;
}
</style>zwischen <head> und </head> unterbringen und nicht mitten im body-Element.
Freundliche Grüße
Vinzenz
-
Hallo Vincenz,
vielen Dank für Deine rasche Antwort. Ich Erstelle die Webseite In Hype. Den Text unten setzte ich über einen Textbaustein als HTML5 in die Seite. Habe also direkt aus Hype keinen Zugriff auf den gesamten Code. Wenn ich dann aus Hype heraus die Html Seite erstellen lasse und diese mit Textwrangler öffne kann ich den Code der Slideshow niergens sehen. Irgend eine Idee?Freundliche Grüsse Marco
Hallo Marco,
Die horizontale Slideshow funktioniert im Firefox einwandfrei. Bei Safari und Chrome bleibt aber der Slider unter den Bilder unsichtbar. Kann mir ev. jemand sagen wo der Fehler liegt?
div style="width:100%; height: 575px; overflow:auto; font-family: Arial; font-size: 12px; color:transparent; background:transparent;" align="justify">
<div style="width:7320px; height:550px; margin-left:7px;">zur Zeit solltest Du folgendes:
<style type="text/css">
.scrollimg {
border-width:0px;
border-color:#ffffff;
border-style:solid;
margin-top:5px;
margin-left:7px;
margin-right:7px;
}
img.horizontal {
width: 825px;
height:550px;
}
img.vertical {
width: 367px;
height:550px;
}
</style>zwischen <head> und </head> unterbringen und nicht mitten im body-Element.
Freundliche Grüße
Vinzenz
-
Hallo Marco,
vielen Dank für Deine rasche Antwort. Ich Erstelle die Webseite In Hype.
dieses Hype?
Den Text unten setzte ich über einen Textbaustein als HTML5 in die Seite.
HTML5? Nein, dann fehlt das scoped-Attribut.
Habe also direkt aus Hype keinen Zugriff auf den gesamten Code. Wenn ich dann aus Hype heraus die Html Seite erstellen lasse und diese mit Textwrangler öffne kann ich den Code der Slideshow niergens sehen. Irgend eine Idee?
Dieses Hype scheint nicht der Hit zu sein :-) Ich kann diese Kombination nicht testen ...
Freundliche Grüße
Vinzenz
-
Hey Vinzenz,
ja ich versuche mich mit diesem Programm. Über die Qualität kann ich nicht viel sagen da ich wirklich nicht sehr beschlagen bin in dieser Thematik. An der Stelle schon mal ein grosses Dankeschön das einem Anfänger hier so vorbehaltslos und rasch geholfen wird.
Nur damit ich nicht dumm sterben muss. Weshalb kan ich den Slider in Firefox sehen und in den anderen Browsern nicht?
Wenn ich den selben Baustein in iWeb einsetzte funktioniert es in allen Browsern tadellos.
Giebt es einen einfachen Weg den Slider durch Pfeile ( nach links, nach rechts) zu ersetzen. Würde mit persönlich besser gefallen.
Unter www.catchthelightneu.herzig-fiechter.ch findest Du die Seite probehalber aufgescahltet. Vielecht findest Du ja kurz die Zeit reinzuschauen.LG Marco
Hallo Marco,
vielen Dank für Deine rasche Antwort. Ich Erstelle die Webseite In Hype.
dieses Hype?
Den Text unten setzte ich über einen Textbaustein als HTML5 in die Seite.
HTML5? Nein, dann fehlt das scoped-Attribut.
Habe also direkt aus Hype keinen Zugriff auf den gesamten Code. Wenn ich dann aus Hype heraus die Html Seite erstellen lasse und diese mit Textwrangler öffne kann ich den Code der Slideshow niergens sehen. Irgend eine Idee?
Dieses Hype scheint nicht der Hit zu sein :-) Ich kann diese Kombination nicht testen ...
Freundliche Grüße
Vinzenz
-
Problem gelöst. Irgendwie hat Hype wohl gebockt. Ich habe nun die Gallerie un iWeb erstellt und lasse diese nun per iframe in der Seite Anzeigen
Gruss Marco
-
-
-
-
-
Om nah hoo pez nyeetz, Marco66!
bitte zitiere sinnvoll, nur das worauf du dich beziehst, nicht einfach alles.
Folgende Hinweise zur Verbesserung deines Codes möchte ich dir noch geben:
* Verwende für CSS-Angaben eine eigene CSS-Ressource, also weder style-Element, noch style-Attribut
* Die Angabe background: transparent sollte nicht notwendig sein, denn dies ist zum Einen die Voreinstellung und zum Anderen wird der Wert der Background-Eigenschaft nicht vererbt. Notwendig wäre sie, hättest du in deinem Style-Sheet zum Beispiel die Deklaration* {background-color: black;}
* Ähnliches gilt für overflow.
* color: transparent ist IMHO auch überflüssig
* Bei der Angabe der Schriftart sollte man eine Schriftartenfamilie als FallBack mit dazu angeben, in deinem Fall serifenlose Schriften, denn jemand, der die Schriftart Arial nicht auf seinem Rechner hat, bekommt das Dokument in der Standardschriftart angezeigt, was oft eine Serifen-Schriftart ist.
* Die Tatsache, dass du jedes Bild in zwei Klassen "scrollimg" und "horizontal" steckst, lässt darauf schließen, dass es auch noch vertikal (oder sonstwie anders) scrollende Bilder gibt. Falls nicht, reicht _eine_ Klasse. Benutze zudem den Nachfahrenselektor.HTML
<ul class="scroll"> <!-- Es handelt sich um eine Liste von Bildern --> <li><img src="..." alt="aussagekräftiger Text"></li> ... </ul>CSS
.scroll img {...}Matthias
--
1/z ist kein Blatt Papier.
