Autor |
Nachricht |
AR_Wocom
Threadersteller
Dabei seit: 03.08.2011
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 03.08.2011 12:17
Titel Objekte bewegen sich mit jedem Klick - ohne Flash |
|
|
Hallo Community,
wie im ersten Thread schon erwähnt habe ich zwei Probleme. Hier ist also Nummero 2:
Ich habe ein Layout bekommen und soll das nun umsetzen. Generell kein Problem - abgesehen davon dass ich PRINT bin und NONprint nur selber irgendwie angeeignet habe. Ich stecke also nicht so tief drinnen um wirklich alles zu können.
Jetzt sieht das Layout, welche ich mal als grobe Grafik anhänge, eine Aktion vor. Wenn ich klicke, dann sollen zwei Wörter, die im Head neben dem Logo stehen, sich permanent näher zum Logo hin bewegen. Das ganze geht nur vorwärts, es ist nicht vorgesehen dass die Wörter einmal vom Logo wegwandern. Das ganze soll den Weg zur Lösung, also dem Kunden darstellen. Fragt nicht, das habe ich mir nicht ausgedacht
Im Flash hätte ich das noch mit einem Zähler hinbekommen, aber wie mache ich das ohne Flash? Auch hier wäre ich wieder sehr dankbar für jeden Denkanstoß den ihr so habt. Gibt es da vielleicht auch eine Art zähler die ich einbauen kann?
Vielen lieben Dank!
Und hier die Grafik
|
|
|
|
|
choise
Dabei seit: 01.02.2007
Ort: Würzburg
Alter: 35
Geschlecht:
|
Verfasst Mi 03.08.2011 16:25
Titel
|
|
|
Mit einem Klick auf was? das Logo? Naja ist ja auch ehr zweitrangig.
Du könntest das ganze zb mit Hilfe von jQuery machen. Als erstes setzt du ein click Event auf den entsprechenden Selector.. Dann animierst du jeweils die 2 Wörter mit Hilfe von animate.
Am besten setzt du die Wörter absolut innerhalb deines Header Bereiches und animierst dann nur die left/right Werte entsprechend.
Einfach fragen, wenn du mehr Hilfe brauchst.
|
|
|
|
|
Anzeige
|
|
|
AR_Wocom
Threadersteller
Dabei seit: 03.08.2011
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Do 04.08.2011 08:35
Titel
|
|
|
choise hat geschrieben: | Mit einem Klick auf was? das Logo? Naja ist ja auch ehr zweitrangig.
Du könntest das ganze zb mit Hilfe von jQuery machen. Als erstes setzt du ein click Event auf den entsprechenden Selector.. Dann animierst du jeweils die 2 Wörter mit Hilfe von animate.
Am besten setzt du die Wörter absolut innerhalb deines Header Bereiches und animierst dann nur die left/right Werte entsprechend.
Einfach fragen, wenn du mehr Hilfe brauchst. |
Ja, das Logo Das eine Wort wandert also nach links, das andere nach rechts. Und der Grafiker der froh ist eine normale HTML-Seite zu erstellen oder minimal was mit Flash kann soll's richten. Okay, andere Geschichte.
Der Clickevent ist allerdings die ganze Seite. Geht das so einfach? Finde das Konzept eh etwas albern, aber wenn man meint die sollen sich bei jedem Klick bewegen, dann werde ich da erstmal noch nicht gegenschwimmen.
Danke aber schon mal für die bisherigen Infos, ich lese mich da mal ein
|
|
|
|
|
choise
Dabei seit: 01.02.2007
Ort: Würzburg
Alter: 35
Geschlecht:
|
Verfasst Do 04.08.2011 20:59
Titel
|
|
|
na wollen wir mal nich so sein: http://jsfiddle.net/AUmCw/2/
Code: |
<div id="header">
<span id="text_left">Hallo</span>
<div id="logo">My Company</div>
<span id="text_right">Welt</span>
</div>
<div id="content">
some sample content
some sample content
some sample content
some sample content
some sample content
some sample content
</div>
|
Code: |
#header { position: relative; }
#logo {
text-align: center;
font-size: 18px;
font-weight: bold;
}
#text_left, #text_right {
position: absolute;
left: 10px;
top: 18px;
}
#text_right {
left: auto;
right: 10px;
}
#header, #content {
width: 300px;
background-color: #CCC;
margin: 0 auto 15px;
padding: 15px 20px;
}
|
Code: |
$(function() {
var clicked = false;
$('body').click(function(){
if(clicked) return;
clicked = true;
var $left = $('#text_left');
var $right = $('#text_right');
$left.animate({left: '70px'}, 500);
$right.animate({right: '70px'}, 500);
});
});
|
Zuletzt bearbeitet von choise am Do 04.08.2011 21:00, insgesamt 1-mal bearbeitet
|
|
|
|
|
AR_Wocom
Threadersteller
Dabei seit: 03.08.2011
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 05.08.2011 11:31
Titel
|
|
|
Domo Arigato! Wird schnellstmöglich getestet
|
|
|
|
|
choise
Dabei seit: 01.02.2007
Ort: Würzburg
Alter: 35
Geschlecht:
|
Verfasst Sa 06.08.2011 13:40
Titel
|
|
|
jquery einbinden nicht vergessen.
|
|
|
|
|
|
|
|
Ähnliche Themen |
Flash MX: Movieclip mit Maus bewegen
FLASH text an pfad entlang bewegen
[flash] movieclip mittels tween-klasse bewegen
Flash Grafik per Mouseover nach links oder rechts bewegen
Flash 8 - Wechselbanner per Klick.
[Solved] // [Flash/AS] Klick auf Bühne
|
|