Vorhang für Internetseite

[Matthias Bode]

Hallo zusammen,
ich soll für ein Projekt unseres Stadtjugendringes eine Internetseite erstellen. Da es sich um etwas musikalisches handelt, kam irgendwer auf die Idee, beim Start der Seite einen Vorhang öffnen zu lassen, der von der mitte der Homepage zu den Seiten aufgeht. (Ich persönlich finde die Idee nicht wirklich toll, egal)

Kleine Spielerei, lange Suche. Ich habe viele Beispiele durch die Googlesuche gefunden, jedoch waren die alle sehr plumb, es wurde nur zwei farbige rechtecke von der mitte nach außen verschoben. Ich möchte allerdings ein richtiges Bild von einem Vorhang haben, der sich öffnet nich nur zwei farbige divs.

eigentlich reicht es ja sogar schon, wenn zwei bilder mit den jeweiligen vorhanghälften von der mitte der seite nach außen verschoben werden und über den Rand des Bildschirms hinaus, so dass der effekt eines sich öffnenden Vorhangs entsteht.

Gibt's sowas? ein kompletter Skript (mit bildern für die vorhänge) ginge auch.

MfG
und Dank im Voraus
Matthias

[Cheatah]

Hi,

Gibt's sowas?

ist identisch mit dem, was Du hast. Statt einer Hintergrundfarbe nimmst Du die -grafik.

Cheatah

[Reiner]

hi,

ich soll für ein Projekt unseres Stadtjugendringes eine Internetseite erstellen. Da es sich um etwas musikalisches handelt, kam irgendwer auf die Idee, beim Start der Seite einen Vorhang öffnen zu lassen, der von der mitte der Homepage zu den Seiten aufgeht. (Ich persönlich finde die Idee nicht wirklich toll, egal)

Kleine Spielerei, lange Suche. Ich habe viele Beispiele durch die Googlesuche gefunden, jedoch waren die alle sehr plumb, es wurde nur zwei farbige rechtecke von der mitte nach außen verschoben. Ich möchte allerdings ein richtiges Bild von einem Vorhang haben, der sich öffnet nich nur zwei farbige divs.

kombiniere das doch vielleicht mit einem anim. GIF, dann sieht das sicher schon gut aus. Man kann damit allerhand lustige Sachen machen.

Gruß
Reiner

[Gernot Back]

Hallo Matthias,

ich soll für ein Projekt unseres Stadtjugendringes eine Internetseite erstellen. Da es sich um etwas musikalisches handelt, kam irgendwer auf die Idee, beim Start der Seite einen Vorhang öffnen zu lassen, der von der mitte der Homepage zu den Seiten aufgeht.

Gibt's sowas? ein kompletter Skript (mit bildern für die vorhänge) ginge auch.

Für den Vorhang nimmst du einen Verlauf als gekachelten Hintergrund, dann wirkts schön wellig. Vielleicht so etwas in der Art wie meine Studie hierzu von vor drei Jahren.

http://www.sprachlernspiele.de/grauschleier/

Gruß Gernot

[Matthias Bode]

Für den Vorhang nimmst du einen Verlauf als gekachelten Hintergrund, dann wirkts schön wellig. Vielleicht so etwas in der Art wie meine Studie hierzu von vor drei Jahren.

http://www.sprachlernspiele.de/grauschleier/

Gruß Gernot

Hallo
Die Studie hat mir sehr geholfen.
Darf ich sie eventuell auf der Seite benutzen?
Habe sie schon etwas umgebaut, nur habe ich eine Frage:
Brauch man, damit das ding im IE funktioniert unbedingt das Frameset?

Die folgenden Zeilen sind glaub ich das Problem:

if((navigator.appName=="Netscape")||(navigator.userAgent.toLowerCase().indexOf("opera")>-1)) {
var wd = 2*innerWidth;
var ht = 2*innerHeight;
}

else {
var wd = 2*parent.document.body.clientWidth;
var ht = 2*parent.document.body.clientHeight;
}

Für den Internet-Explorer wird die Größe des Elternelements benötigt.
Geht das auch anders? ansonsten wäre der Skript perfekt für mich.

MfG
Dank im Voraus
Matthias

[Gernot Back]

Hallo Matthias,

Darf ich sie eventuell auf der Seite benutzen?

Bedien dich, die Grafiken machst du ja wohl auch nicht in Barbie-Rosa.

Habe sie schon etwas umgebaut, nur habe ich eine Frage:
Brauch man, damit das ding im IE funktioniert unbedingt das Frameset?

Ja aber das Folgende kannst du besser als ich damals:

Die folgenden Zeilen sind glaub ich das Problem:

Das ist ein Beispiel aus meiner Urzeit, bitte nicht mehr mit "navigator.appName" arbeiten, frag einfach ab, ob es innerWidth gibt.

if((navigator.appName=="Netscape")||(navigator.userAgent.toLowerCase().indexOf("opera")>-1)) {
var wd = 2*innerWidth;
var ht = 2*innerHeight;
}

else {
var wd = 2*parent.document.body.clientWidth;
var ht = 2*parent.document.body.clientHeight;
}

Für den Internet-Explorer wird die Größe des Elternelements benötigt.
Geht das auch anders? ansonsten wäre der Skript perfekt für mich.

Das Problem ist, dass die Maße des Dokuments im IE erst ausgenmessen werden können, wenn es geladen ist. Da das meiste aber hier dynamisch erst ins Dokument geschrieben wird - je nach Größe - messe ich einfach die Größe des Mutter-Framesets aus, das vorher existiert. Wenn du zuerst ein leeres Dokument lädst, dort die Größe ausmisst und dann alle möglichen Elemente nachträglich mit createElement() einbaust, geht es bestimmt auch anders, wird aber noch komlizierter.

Gruß Gernot

[Gernot Back]

Nachtrag:

Wenn du auf das Spotlight verzichtest, müsste der Vorhang und seine Hintergrundkachel auch mit prozentualen Höhen- und Weiten-, und Positionsangaben bzw. background-position (linke Seite rechts, rechte Seite links ausgerichtet) zu machen sein, ohne dass du per JS vorher irgendetwas ausmessen musst.

Gruß Gernot

[Matthias Bode]

Nachtrag:

Wenn du auf das Spotlight verzichtest, müsste der Vorhang und seine Hintergrundkachel auch mit prozentualen Höhen- und Weiten-, und Positionsangaben bzw. background-position (linke Seite rechts, rechte Seite links ausgerichtet) zu machen sein, ohne dass du per JS vorher irgendetwas ausmessen musst.

Gruß Gernot

So richtig gut auskennen tue ich mich in Javascript nicht, alles nur irgendwie selber beigebracht und kein richtiges Wissen, aber habe das Ganze schon einmal eingebaut.
http://www.musizierstun.de/Vorhang.htm

Werde noch ein wenig rumbasteln, dass ich auf das Frameset verzichten kann. Ersteinmal vielen vielen DANK!

MfG
Matthias

[joe2.0.3]

Hi,

schau Dir das mal an:
http://www.tu-darmstadt.de/helps/w3grafik/vorhang.htm

Das ist ein Frame-Beispiel, wie sich ein Vorhang realisieren lässt.
Die Rahmen des Frames lassen sich bewegen, so dass der Vorhang vom
Benutzer auf und zugezogen werden kann.

Gruß
joe123