Willkommen auf dem Portal für Mediengestalter
|
|
Autor |
Nachricht |
tornadorot
Threadersteller
Dabei seit: 13.03.2009
Ort: schönste Stadt der Welt
Alter: -
Geschlecht:
|
Verfasst Mo 23.03.2009 01:49
Titel Javascript - mehrere Animationen auf einer html-Seite |
|
|
Liebe Leute,
in diesem Forum habe ich bisher super Tips bekommen, alle ausprobiert, einige haben mich zum Ziel geführt. Dafür fettes Dankeschön!!!
Aber jetzt verzweilfle ich fast: ich habe mir mehrere Galerieseiten erstellt, auf die ich von einer Startseite verlinken möchte. Die Verlinkung soll als animiertes Bild in jeweils eigenem "Fernseher"-Rahmen erfolgen, soll heißen, ich habe auf einer Seite mehrere "Fernseher"-Grafiken, auf deren Bildschirm dann bei mouseover ein einfach animiertes javasript abläuft und per klick auf die jeweilige Galerie verlinkt. Hier habe ich ein Beispiel:
http://www.drushbapankow.de/
(das scheinen leider Frames zu sein, wenn man auf "Proben" klickt, kommt eine Seite, auf der mehrere Sprechblasen mit mouseover sind).
Ich habe auf meiner Startseite ein javascript eingebunden, der wunderbar funktioniert - solange nur ein script pro seite ausgeführt wird. Ich möchte aber gerne mehrere "Fernseher" nebeneinander haben (wie die Sprechblasen im Beispiel nebeneinander), aber das haut nicht hin. Könnt ihr mir sagen, wie das heisst, wonach ich suchen muss? Und auch, ob ich die Script-Datei, ähnlich wie css, auslagern sollte?
Hier ist mein Quellcode:
Code: |
<!-- das steht im head-->
<script type="text/javascript">
var a = new Image(); a.src = 'galerie/fernseher_act_grau_hover.jpg';
var b = new Image(); b.src = 'galerie/fernseher_act_hover.jpg';
var c = new Image(); c.src = 'galerie/fernseher_act_hover.jpg';
</script>
<!-- das steht im body-->
<a href="arbeiten1.html" onmouseover="document.images['s3a'].src='galerie/fernseher_act_hover.jpg';" onmouseout="document.images['s3a'].src='galerie/fernseher_act_grau_hover.jpg';" onmousedown="document.images['s3a'].src='galerie/fernseher_act_grau_hover.jpg';" onmouseup="document.images['s3a'].src='galerie/fernseher_act_hover.jpg';"><img src="galerie/fernseher_act_grau_hover.jpg" name="s3a" height="244" width="300" alt="" border="0"></a>
|
viele fragende Grüße,
tornadorot
|
|
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Mo 23.03.2009 09:24
Titel
|
|
|
Ich hab den Text jetzt 3 mal gelesen und bin mir immernoch nicht sicher, was genau du willst
Aber ich hatte auch noch keinen Kaffee..
Also .. das von dir verlinkte Beispiel ist ja nicht von dir - könnten wir deinen kompletten Code live sehen um nach eventuellen Fehlern zu suchen?
Außerdem vergibst du im header die Pfade zu den Bildern, benutzt die da vergebenen Variablen aber unten gar nicht mehr.. da könntest unten auch einfach "document.....src=a.src" schreiben.
Vergibst du denn bei jedem neuen "Fernseher" auch neue Variablennamen?
|
|
|
|
|
Anzeige
|
|
|
tornadorot
Threadersteller
Dabei seit: 13.03.2009
Ort: schönste Stadt der Welt
Alter: -
Geschlecht:
|
Verfasst Mo 23.03.2009 16:07
Titel
|
|
|
Moin Ferret,
ich habe leider noch nix live (arbeite mit Coda-Vorschau und Browsern). Was ist gepostet habe, ist der komplette (java-)Code, sonst nur reines HTML und CSS.
Die Fernseher sind quasi der feste Rahmen mit einem Bild drin, dass bei hover wechselt (wie die Sprechblasen im Beispiel, nur dass bei denen ja gezeichneter Text drin ist). Geht man mouseover bei einem Fernseher, soll das Bild (in dem betreffenden Fernseher) wechseln, und bei klick auf das Bild soll auf eine andere Seite verlinkt werden. Das funktioniert, solange ich nur einen Fernseher mit Java-Animation auf der Seite habe. Bei zwei fernsehern tut sich gar nichts mehr, sie bleiben statisch. Wie bei den Sprechblasen im Beispiel möchte ich aber mehrere Fernseher mit unterschiedlichen Bildern und Verlinkungen nebeneinander haben, das ganze soll eine Art Navigation geben.
Ich hatte keinen neuen Variablennamen vergeben bei dem zweiten Fernseher (Du meinst z.B. für Fernseher 1 var a., var b., var c., für Fernseher 2 var d., var e., var f. ?)
Ich habe mich an diesem Tut orientiert (Beipiel 1)[url=http://www.howtocreate.co.uk/tutorials/jsexamples/testingRoll.html]http://www.howtocreate.co.uk/tutorials/jsexamples/testingRoll.html[/url]
Es könnte so einfach sein...
Viele Grüße
|
|
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Mo 23.03.2009 16:14
Titel
|
|
|
Java != JavaScript
... ich vermute jetzt einfach mal, dass du den verschiedenen Bildern keine einmaligen Namen gegeben hast.
Müsstest halt beim ersten "s3a" _überall_ (also 5 mal) nehmen und beim zweiten dann "s4a" oder was auch immer.
Ohne den Rest des HTML-Codes bleibts trotzdem ein Rumgerate..
Welche Meldung bringt denn die Fehlerkonsole?
|
|
|
|
|
tornadorot
Threadersteller
Dabei seit: 13.03.2009
Ort: schönste Stadt der Welt
Alter: -
Geschlecht:
|
Verfasst Di 24.03.2009 01:57
Titel
|
|
|
Hallo Ferret,
1000dank für den Hinweis - klar, das wars! Ich hatte die Variablen nicht den einzelnen Fernsehern (und ihren Bildern) zugeordnet.
Vielen Dank!!!!
|
|
|
|
|
|
|
|
Ähnliche Themen |
zufaellige HTML Seite mit Javascript, ohne Wiederholung
Blogger Seite an eine HTML Seite anpassen.
Frage zu Javascript - Tiefe der Seite
Javascript - Seite im Queformat drucken?
[Javascript] Formulareingaben auf aktualisierter Seite
Schatten im IE: CSS, HTML - zur not javascript
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben. Du kannst auf Beiträge in diesem Forum nicht antworten. Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|