✔ Homepagenavigation à la Sony

Vectormaster

Vectormaster

Mitglied
Guten Tag,
ich sammle in den letzten Tagen einige Ideen für meine neue Homepage. Da ich bezüglich Weinachten einen neuen Fernsehers gesucht habe, bin ich auf die Sony - Homepage gestoßen und bin von der Navigation sehr beitrugt. Ich habe bei Google und anderen Suchmaschinen so wie in diversen Foren nach Informationen darüber, wie man sich so eine Navigation „baut“ gesucht, jedoch nichts gefunden. Nun wollte ich Euch fragen, ob Ihr mir da eventuell ein paar Seiten empfehlen könnt oder eventuell sonstige Tipps für mich habt.

Hier noch der Link zur Sony – Homepage

Danke schon im Voraus,
Vectormaster
 
Das beruht auf selbst Programmierten Scrollbalken , weiß nun nicht ob sie nen Framework dafür nutzen. Aber Apple hat genau das gleiche auf ihrer Homepage.

Ich hab sowas zumindest schon gefunden solche JS Scrollbalken , mhm die ich nun gefunden habe waren alle kommerziell aber ich habe in Erinnerung das ich mal welche gesehen habe die kostenlos waren

Wenn Du sowas selber programmieren willst teile Dir das gleich in 2 Bereiche auf:

Slider das ist das Ding in der Mitte
und Scrollbar das is alles drum herrum.

Am besten gibst beiden nur die ID's von den Containern mit das spart Dir ne Menge arbeit das alles selber per JS zu erstellen und b) kann der Benutzer das dann noch frei designen.
So das sich die 2 Klassen Slider und Scrollbar eigentlich nur noch um die Funktionsweise kümmern müssen.Das ermöglicht auch die runden Ecken , das CSS verfahren heißt dazu Sliding Doors.

Der Slider ist das was du rumschieben kannst in seinen klaren Grenzen.
die Scrollbar ist dann sozusagen alles drum herrum + Anpassung des Sliders an seine höhe + weite

Der sichbare Bereich zum inneren Dokument (das wo die Inhalte sind) verhält sich wie Slider zur Scrollgrundfläche.

So habe ich damals zumindest meine gemacht.
 
Hallo,
danke für Deine schnelle Antwort. Jedoch meine ich nicht das Menü sonder das, was aufgerufen wird, sobald man oben z.B. auf Produkte klickt. Dann öffnet sich eine Art „Lightbox“, welche dann das Menü enthält. Mir ist diese Art des Menüs schon einmal vor ein paar Monaten bei Microsoft aufgefallen jedoch haben die zwischenzeitlich ihr Menü durch Pulldown - Menüs ersetzt.

Das Menü, das Du meinst, gibt es fertig unter www.ajaxrain.com zum Download.

Danke für eure Antworten
Vectormaster
 
Hi,

hast du dir schon mal die Mühe gemacht, einfach einen Blick in den Quellcode der Seite, insbesondere in den der eingebundenen Javascripts, zu werfen, der jedes Geheimnis preisgibt, was darin auf welche Weise umgesetzt wurde?

mfg Maik
 
Hi,
ja, habe ich jedoch kann ich daraus nicht wirklich etwas schließen. Es gibt einen Tag, „
HTML: 
<body onresize="" onunload="" onload="">
“ jedoch weis ich nicht genau was dieser zu bedeuten hat.
Ich habe gerade eben etwas mit der Greybox von Orangoo „herumgespielt“ und bin schon so weit, dass ich die Greybox schließen kann jedoch bin ich noch nicht so weit, dass beim schließen im Browser dann die ausgewählte Seite angezeigt wird.

Mein Code bis jetzt:
HTML: 
<head>
<script type="text/javascript">
        var GB_ROOT_DIR = "./greybox/";
    </script>
    <script type="text/javascript" src="greybox/AJS.js"></script>
    <script type="text/javascript" src="greybox/AJS_fx.js"></script>
    <script type="text/javascript" src="greybox/gb_scripts.js"></script>
    <link href="greybox/gb_styles.css" rel="stylesheet" type="text/css" media="all" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
</head>
<body>
<table width="329" border="0">
  <tr>
    <td>&nbsp;</td>
    <td bgcolor="#993333">&nbsp;</td>
  </tr>
  <tr>
    <td bgcolor="#0066FF">&nbsp;</td>
    <td></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td><a href="#" onclick="parent.parent.GB_hide();" >menuepunkt1</a></td>
  </tr>
</table>
</body>

Die Zeile “<a href="#" onclick="parent.parent.GB_hide();" >menuepunkt1</a> “ soll laut der Dokumentation von Orangoo die Greybox schließen, welches auch erfolgreich ausgeführt wird.
Jedoch wenn ich statt dem # in <a href="#" onclick="parent.parent.GB_hide();" >menuepunkt1</a> die aufzurufende Seite angebe, so wird diese jedoch nicht aufgerufen, sondern ich komme zu der Seite zurück, mit welcher ich die Greybox aufgerufen habe.

Habe ich eventuell einen Fehler gemacht?...

Ich bedanke mich für Eure Antworten
Vectormaster
 
Zuletzt bearbeitet:
Hi,

hast du schon versucht, die location-Eigenschaft der aufrufenden Seite zu ändern?
Code: 
<td><a href="#" onclick="parent.parent.location='http://www.tutorials.de/'; parent.parent.GB_hide();" >menuepunkt1</a></td>
Ciao
Quaese
 
Hallo,
danke für Deine Antwort. Nun funktioniert meine Navigation wie folgt:

Wenn man auf einen Menüpunkt klickt, wird eine Greybox mit einer HTML Seite, welche die Links zu den anderen Seiten enthält, aufgerufen. Durch klicken auf einen Link, schließt sich die Greybox und im Browserfenster wird die ausgewählte Seite angezeigt.

Nochmals danke für Eure Hilfe
Vectormaster
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück