nicht angemeldet
Ganz spezielle Galerie ohne Flash
Heyho!
Kurze Frage:
www.ondro.com (bitte auf female bei den galerien klicken)
Wie kann ich so eine Galerie mit Mitteln erstellen, die keinerlei Flash oder irgendwelche Plugins benötigen, die nicht auf jedem Rechner verfügbar sind?
Ich will eine Homepage bauen, die ich auf jedem iPhone, iPad, Mac, PC und Liux Rechner öffnen kann. Egal ob Firefox, Safari oder IE6.0 oder IE8.
Ich weiß, es geht, aber ich weiß nicht wie. Einfach aneinandergereihte Bilder mit einer Scrollbar darunter.
Wie kann ich sowas realisieren?
Dankeschön!
lg,
Sebastian
-
Ich weiß, es geht, aber ich weiß nicht wie. Einfach aneinandergereihte Bilder mit einer Scrollbar darunter.
Pack die Bilder in rin <http://de.selfhtml.org/css/eigenschaften/positionierung.htm#overflow@title=scrollbares DIV>
gruß
andi-
vielen vielen Dank!!!!
-
so, ich hätt's jetzt probiert.
mein Quellcode:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html><head><title>overflow</title>
</head><body>
<div style="width:1200px; height:750px; overflow:scroll; border:1px solid #840; margin:1em;">
<img src="01.jpg" width="1050px" height="700px" alt="">
<img src="01.jpg" width="1050px" height="700px" alt="">
<img src="01.jpg" width="1050px" height="700px" alt="">
<img src="01.jpg" width="1050px" height="700px" alt="">
</div>
</body>
</html>Problem: Das Fenster ist (wie gewollt) 1200px breit, jedoch ist die scrollfunktion jetzt nur "nach unten". Ich hätte sie aber gerne seitwärts. Also fixe höhe, fixe Breite und variable hidden-breite.
Wisst ihr wie ich meine?
Danke!
-
Om nah hoo pez nyeetz, Sebastian!
die Suche im Forum hätte diesen Thread ausgespuckt.
PS: bitte nicht <nobr> verwenden PSS: bitte auch die Tipps für Fragende berücksichtigen
Matthias
--
-
-
-
-
so, ich hätt's jetzt probiert.
mein Quellcode:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html><head><title>overflow</title>
</head><body>
<div style="width:1200px; height:750px; overflow:scroll; border:1px solid #840; margin:1em;">
<img src="01.jpg" width="1050px" height="700px" alt="">
<img src="01.jpg" width="1050px" height="700px" alt="">
<img src="01.jpg" width="1050px" height="700px" alt="">
<img src="01.jpg" width="1050px" height="700px" alt="">
</div>
</body>
</html>Problem: Das Fenster ist (wie gewollt) 1200px breit, jedoch ist die scrollfunktion jetzt nur "nach unten". Ich hätte sie aber gerne seitwärts. Also fixe höhe, fixe Breite und variable hidden-breite.
Wisst ihr wie ich meine?
Danke!
-
jedoch ist die scrollfunktion jetzt nur "nach unten". Ich hätte sie aber gerne seitwärts.
http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float@title=float:left;
c'mon. bisschen selbst suchen muss schon drin sein, oder? Ist die selbe Seite wie vorhin!! :)
-
Om nah hoo pez nyeetz, andi!
jedoch ist die scrollfunktion jetzt nur "nach unten". Ich hätte sie aber gerne seitwärts.
[ref:self812;css/eigenschaften/positionierung.htm#float@title=float:left;]
Wenn aber nicht genug* Platz ist, hilft float auch nicht.
*und es soll ja nicht genug Platz sein!
Matthias
--
-
Om nah hoo pez nyeetz, andi!
jedoch ist die scrollfunktion jetzt nur "nach unten". Ich hätte sie aber gerne seitwärts.
http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float@title=float:left;
Wenn aber nicht genug* Platz ist, hilft float auch nicht.
*und es soll ja nicht genug Platz sein!
Matthias
Heyho!
Habs mal versucht, jedoch ist der gallery-div nicht zentriert... Weiß jmd wo der Fehler ist?
Die bis jz einzige html-Datei:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head> <title>overflow</title> <link rel="stylesheet" type="text/css" href="stylesheet.css"> </head> <body> <body bgcolor="#dddddd"> <div id="page"> <div id="menu"><img src="nav.jpg"> </div> <div id="gallery"> <nobr> <img src="01.jpg" width="1050px" height="700px" alt=""> <img src="01.jpg" width="1050px" height="700px" alt=""> <img src="01.jpg" width="1050px" height="700px" alt=""> <img src="01.jpg" width="1050px" height="700px" alt=""> </nobr> </div> </div> </body> </html>css:
#page { text-align: center; background-color:#dddddd; position: relative; padding-top:50px; border: 0px solid #FFFFFF; font-family: Verdana, Helvetica, Arial, sans-serif; font-size: 1.2em; border: 0px solid #FFFFFF; } #menu { position: relative; text-align: center; font-family:Verdana, Helvetica, Arial, sans-serif; font-size: 0.8em; background-color:#dddddd; margin-left:0 auto; margin-right:0 auto; border: 0px solid #FFFFFF; } #gallery { text-align: center; border: 15px solid #FFFFFF; position: relative; width:1024px; height:720px; overflow:scroll; margin-left:0 auto; margin-right:0 auto; background-color:#dddddd; float: left; }Ideen?
lg,
-
Om nah hoo pez nyeetz, Sebastian!
Verwende ein Debugging-Tool z.B. Firebug (FF), Dragonfly (Op) oder die Entwicklertools im IE. Dann kannst du deine Fehler sehen.
die position:relative; sind überflüssig die Angaben zu margin falsch
Matthias
--
-
-
-
-