Milliondollarhomepage - Pixelkästchen
- geschlossen
- KingstonTown
- 2162 Aufrufe 24 Antworten
Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen
-
-
N'Abend,
was meinst du genau? Milliondollarhomepage??? Pixelkästchen?
Meinst du einfach nur Flächen, die eine Farbe haben?
Gruß
Broken SwordAuf dem Abstellgleis sah man ihn liegen,
Auf dem Abstellgleis zwischen Schwelle und Gestein,
Auf dem Abstellgleis im strömenden Regen,
Auf dem Abstellgleis allein. -
Moin moin.
Was du suchst sind wahrscheinlich "Image Maps" ("Verweis-sensitive Grafiken").
SELFHTML: HTML/XHTML / Grafiken / Verweis-sensitive Grafiken (Image Maps)
Verweis-sensitive Grafiken sind Grafiken, in denen der Anwender mit der Maus auf ein Detail klicken kann. Daraufhin wird ein Verweis ausgeführt. Auf diese Weise kann der Anwender in einigen Fällen wesentlich intuitiver und schneller zu Information gelangen als durch lange verbale Verweislisten.
Gruß,
Commander KeenIch habe das Wort "Europa" immer im Munde derjenigen Politiker
gefunden, die von anderen Mächten etwas verlangten, was sie im
eigenen Namen nicht zu fordern wagten. [SIZE="1"](Nov. 1876)[/SIZE]
[SIZE="1"]Otto von Bismarck[/SIZE] -
schau doch einfach selber mal nach:
The Million Dollar Homepage - Own a piece of internet history!
viel Spass beim Nachmachen
Guardian -
@CommanderKeen,so wie die HP,die GUARDIAN gepostet hat solls sein,dass kommt mit deinem Link leider nicht ganz hin,es sei denn du hast da noch nen besseren Vorschlag
@GUARDIAN
GENAU SO solls sein,aber ganz mir auch erzählen,wie der Quellcode ist?
Habe ihn kopiert um mal zu sehen,wie es läuft,aber leider steige ich da nicht durch -
Hier der Verweis zu SelfHTML: SELFHTML: HTML/XHTML / Grafiken / Verweis-sensitive Grafiken (Image Maps)
Dort wird dir alles erklärt.
Gruß
Broken SwordAuf dem Abstellgleis sah man ihn liegen,
Auf dem Abstellgleis zwischen Schwelle und Gestein,
Auf dem Abstellgleis im strömenden Regen,
Auf dem Abstellgleis allein. -
@KingstonTown doch es ist so wie Broken Sword und Commander Keen schon schrieben, es ist eine Grafik die durch ein Image Map in verschiedene verweissensitive Bereiche aufgeteilt ist
Orginalbild: milliondollarhomepage.com/img-pix/image-map.png
bye
Guardian -
Ja das ist mit besagten Image Maps gemacht worden.
Ich hab aber noch nie so eine extrem grosse Map gesehen.
Hätte auch nie gedacht, das das funktioniert
2.te Alternative wäre ja gewesen, das z.b. in PS zu slicen und dann ne Webpage daraus generieren zu lassen. Allerdings, würde es halt dann beim Laden recht dämlich aussehen, wenn 1000 einzelne Bilder geladen werden -
ich kann dir leider gerade nicht den genauen link raussuchen, weil ich n bisschen im stress bin, wollte dir aber folgende Seite noch eben da lassen, zum selber suchen
Die Seite ist echt top, da wird dir extrem viel geholfen!
Stu Nicholls | CSSplay | Experiments with cascading style sheets | Doing it with Style -
okay,langsam habe ich den Trick raus,aber auf der MILLIONDOLLARHOMEPAGE wurde zu Anfang mal das Pixelmuster gezeigt,wie bekomme ich dass hin ?
Muß ich da jetzt nen Bild malen mit ich sag mal 3000 Pixelfeldern,dies wird als Bild gespeichert und dann kann man es so als Feld sehen oder wie ? -
Was meinst du mit Pixelmuster?
Ich verstehe nicht, was du meinst
Gruß
Broken SwordAuf dem Abstellgleis sah man ihn liegen,
Auf dem Abstellgleis zwischen Schwelle und Gestein,
Auf dem Abstellgleis im strömenden Regen,
Auf dem Abstellgleis allein. -
Na wo MILLIONDOLLARHOMEPAGE an den Start ging,war erst so ein Muster zu sehen wie auf dem Bild,
später wurde es dann zu dem was es heute ist,als mit der ganzen Werbung.
-
Das ist sehr sehr umständlich mit HTML zu realisieren, außer du erstellst eine Div-Box mit dem von dir geposteten Hintergrund als Background.
Kannst das ja versuchen mit Tabellen zu realisieren (td {border:1px #000 solid;}) Das geht code-ärmer als wenn du das mit divs machst.
gruß
Broken SwordAuf dem Abstellgleis sah man ihn liegen,
Auf dem Abstellgleis zwischen Schwelle und Gestein,
Auf dem Abstellgleis im strömenden Regen,
Auf dem Abstellgleis allein. -
Wie genau würde denn der Code Aussehen,wenn man dass mit DIV macht ?
Dass klingt grad bißchen schwierig
Laut SelfHTML gibt man ja die Koordinaten an,wo sich der Link befinden soll
Quellcode
- Ein Viereck (shape="rect") definieren Sie mit den Koordinaten für x1,y1,x2,y2
- wobei bedeuten:
- x1 = linke obere Ecke, Pixel von links
- y1 = linke obere Ecke, Pixel von oben
- x2 = rechte untere Ecke, Pixel von links
- y2 = rechte untere Ecke, Pixel von oben
- Einen Kreis (shape="circle") definieren Sie mit den Koordinaten für x,y,r
- wobei bedeuten:
- x = Mittelpunkt, Pixel von links
- y = Mittelpunkt, Pixel von oben
- r = Radius in Pixel
- Ein Polygon (shape="poly") definieren Sie mit den Koordinaten x1,y1,x2,y2 ... xn,yn
- wobei bedeuten:
- x = Pixel einer Ecke von links
- y = Pixel einer Ecke von oben
- Sie können so viele Ecken definieren wie Sie wollen. Von der letzten definierten Ecke müssen Sie sich eine Linie zur ersten definierten Ecke hinzudenken. Diese schließt das Polygon.
Aber woher weiß ich,wo was ist ? Deswegen meinte ich dass ja mit dem Bild,ich habe ja sonst kein Raster wo ich sagen kann dass in Y1X3 der Link blablabla.de sein soll.
Ich muß ja irgendwo eine Orientierung haben
>>> H I E R <<< kann man dass noch sehen,was ich meinte mit den Pixelfelder,hier ist noch nicht alles mit Werbung ausgefüllt.
Und SO ein Muster meinte ich,dass man dieses irgendwie hinbekommt ?!
weiß keiner mehr weiter ?Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von Broken Sword ()
-
also ich kannte diese Seite bist jetzt noch garnicht
-
djangogo schrieb:
also ich kannte diese Seite bist jetzt noch garnicht
Na DAT hilft mir auch nicht weiter war groß im TV als es rauskam -
Ich versteh dein Problem nicht, du hast doch verschiedene Lösungsvorschläge, die einfacher sind als das mit DIVs zu realisieren -.-"
Aber wenn du unbedingt willst, hier:
HTML-Quellcode
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <title>Test</title>
- <style type="text/css">
- <!--
- .ndiv,.enddiv,.botdiv,.botenddiv {
- width:10px;
- height:10px;
- background-color:#FFF;
- font-size:3px;
- border-right:1px #000 solid;
- border-top:1px #000 solid;
- float:right;
- }
- .enddiv,.botenddiv {
- border-left:1px #000 solid;
- clear:left;
- }
- .botdiv,.botenddiv {
- border-bottom:1px #000 solid;
- }
- -->
- </style>
- </head>
- <body>
- <div style="width:70px">
- <div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="enddiv"> </div>
- <div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="enddiv"> </div>
- <div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="enddiv"> </div>
- <div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="ndiv"> </div><div class="enddiv"> </div>
- <div class="botdiv"> </div><div class="botdiv"> </div><div class="botdiv"> </div><div class="botdiv"> </div><div class="botdiv"> </div><div class="botenddiv"> </div>
- </div>
- </body>
- </html>
Musst halt je nachdem, wieviele Kästchen du hinzufügst beim "main-div" das width erweitern.
Gruß
Broken SwordAuf dem Abstellgleis sah man ihn liegen,
Auf dem Abstellgleis zwischen Schwelle und Gestein,
Auf dem Abstellgleis im strömenden Regen,
Auf dem Abstellgleis allein. -
das Problem JETZT ist,das ich zwar nen Feld mit lauter Kästchen habe,ABER ich die Links etc. nicht direkt in einzelne Kästchen bekomme,sondern diese dann teilweise am Rand der Kästchen sind und anstatt in einem Kästchen sind die über 5-6 Kästchen verteilt
Also ich bekomme die Links nicht direkt ins Bild -
Ja, das ist natürlich klar... Das einzige was du machen kannst, ist mit z-index die verschiedenen DIVs ("Karierte Muster"z-index:1 und Bilder z-index:2) Musst natürlich position:absolute angeben und die Position bestimmen. Alles sehr schwer zu realisieren, vor allem wenn man wenig Ahnung von der Materie hat.
Ich wiederhole mich zwar ungern, aber:
Das ist sehr sehr umständlich mit HTML zu realisieren, außer du erstellst eine Div-Box mit dem von dir geposteten Hintergrund als Background.
Gruß
Broken SwordAuf dem Abstellgleis sah man ihn liegen,
Auf dem Abstellgleis zwischen Schwelle und Gestein,
Auf dem Abstellgleis im strömenden Regen,
Auf dem Abstellgleis allein. -
Broken Sword schrieb:
Ja, das ist natürlich klar... Das einzige was du machen kannst, ist mit z-index die verschiedenen DIVs ("Karierte Muster"z-index:1 und Bilder z-index:2) Musst natürlich position:absolute angeben und die Position bestimmen. Alles sehr schwer zu realisieren, vor allem wenn man wenig Ahnung von der Materie hat.
Ich wiederhole mich zwar ungern, aber:
Gruß
Broken Sword
Ja gut,mit dem Bild habe ich ja das Problem,jetzt mit deinem Code habe ich noch nicht weiter probiert.
Hatte halt mit PI ein Rastermuster erstellt gehabt,wobei ich dass ganze auch umsetzen konnte,dass das Bild angezeigt wird usw.,aber auch DA klappt es nicht,dass die Link in den einzelnen Kästchen sind
Also grob gesagt,alles funktioniert,ich weiß halt nur nicht,wie ich die genaue Postition bestimmen kann,damit der Link/das Bild genau in dem Kästchen sind. -
Hier empfehle ich Programme, wie Dreamweaver. Mit solchen kannst du ganz einfach per Mausklick Area ziehen und so deine Links genau positionieren.
Gruß
Broken SwordAuf dem Abstellgleis sah man ihn liegen,
Auf dem Abstellgleis zwischen Schwelle und Gestein,
Auf dem Abstellgleis im strömenden Regen,
Auf dem Abstellgleis allein. -
oh man,ich habe mit diesen Programmen leider nichts am Hut Kann damit nicht wirklich umgehen
-
Okay... dann seh ich keine andere Lösung, als dir das selber zu machen.
Also, was willst du genau. Ich werde dir das dann estellen!
Was ich mitgekriegt habe einfach nur ein Feld, wo als Hintergrund die Kästchen sind und dann ein paar Bilder, die per area-verlinkt sind, drauf?
Gruß
Broken SwordAuf dem Abstellgleis sah man ihn liegen,
Auf dem Abstellgleis zwischen Schwelle und Gestein,
Auf dem Abstellgleis im strömenden Regen,
Auf dem Abstellgleis allein. -
Na mensch,warum nicht gleich so,hätte uns einiges an sabbeln erspart
Großes Dankeschön schonmal im voraus.
Ja,genau so solls sein,
also ein Feld ich sag mal mit 10x10 Kästchen wo dann halt Bilder drin zu finden sind,und dann halt (je nachdem wie du es anstellst) die Parameter von X und Y mit denen man den Link in das Feld bekommt.
Falls du es ohne X u. Y machst halt nur die Areas und vllt. 2-3 mit nem Bild drin,je nachdem,wie der Quellcode aussieht,damit ich mir nen Überblick verschaffen kann.
Ps: Kann aber auch sein,dass ich die falsche Dreamweaver Version habe ?!
Oder ich bin einfach nur zu blöd heraus zu finden,was du genau meinst.
Naja,mal sehen.
Wie gesagt,die Felder an für sich habe ich als Bild hinbekommen,oder halt das von dir mit den Div.
Es klappt halt auch,das Bild mit den Pixeln anzeigen zu lassen und auch Link hinein zu klatschen,allerdings werden die über mehrere Kästchen verteilt,dass soll so nicht sein,und sie werden am Rand angezeigt
Hier siehst du mal das Bild,welches ich erstellt habe.
Jetzt müßte ich halt nur noch die Links Bilder den Bild anpassen
Allerdings sind die Kästchen etwas zu klein -
keine reaktion des themenstarters!? :mad:
fruehjahrsputz!
! einige aktuelle/offene threads werden wahrscheinlich auf eine hintere seite rutschen!
falls noch wer was wichtiges zu sagen hat, PN an mich und ich mach hier vielleicht wieder auf!?
~ C L O S E D ~
ceeyaa.mex[font="Fixedsys"][/font]
-
Teilen
- Facebook 0
- Twitter 0
- Google Plus 0
- Reddit 0