mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Di 16.04.2024 06:01 Benutzername: Passwort: Auto-Login

Thema: dynamischer scroll von anker zu anker vom 11.02.2010


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> dynamischer scroll von anker zu anker
Seite: 1, 2  Weiter
Autor Nachricht
guuls
Threadersteller

Dabei seit: 03.09.2008
Ort: Mainhausen
Alter: 33
Geschlecht: Männlich
Verfasst Do 11.02.2010 20:59
Titel

dynamischer scroll von anker zu anker

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich möchte gerne 2 pfeile auf meiner Seite erstellen die immer an einer bestimmten position sitzen und dynamisch von einem zum anderen anker sprint...
das heist mein html sieht ungefähr so aus:

Code:

<a name="01">Titel01</a>
<a name="02">Titel02</a>
<a name="03">Titel03</a>
<a name="04">Titel04</a>




und jetzt soll man wenn man auf den pfeil klickt immer einen <a> weiter gehen bzw. zurück gehen...

könnt ihr mir helfen den passen js zu schreiben????
  View user's profile Private Nachricht senden
easteregg

Dabei seit: 15.02.2003
Ort: Deutschland
Alter: 36
Geschlecht: Männlich
Verfasst Do 11.02.2010 21:58
Titel

Antworten mit Zitat Zum Seitenanfang

Wenn du weißt, wie der jeweils nächste Anker heißt (also die ID kennst), kann man das auch ohne Javascript umsetzen.
Code:
<a href="#anker2" id="anker1">Zu Anker 2</a>
<a href="#anker3" id="anker2">Zu Anker 3</a>
<a href="#anker4" id="anker3">Zu Anker 4</a>
<a href="#anker1" id="anker4">Zu Anker 1</a>


Wenn du das nicht weiß, erkläre mal bitte, welche Infos du hast. Ist es sicher, dass zwischen den Links, zwischen denen du springst, keine weiteren stehen?
  View user's profile Private Nachricht senden
Anzeige
Anzeige
guuls
Threadersteller

Dabei seit: 03.09.2008
Ort: Mainhausen
Alter: 33
Geschlecht: Männlich
Verfasst Do 11.02.2010 22:03
Titel

Antworten mit Zitat Zum Seitenanfang

Ja das ganze soll ja aber dynamsich scrollen und nicht einfach hinspringen!

Also ich kenne die ID´s und dazwischen ligt noch fließtext indem auch links sein können die aber keine id haben.
  View user's profile Private Nachricht senden
easteregg

Dabei seit: 15.02.2003
Ort: Deutschland
Alter: 36
Geschlecht: Männlich
Verfasst Do 11.02.2010 22:06
Titel

Antworten mit Zitat Zum Seitenanfang

Dynamisch scrollen? Du meinst bestimmt animiert, smooth, schön mit Javascript...

jQuery plus das Plugin ScrollTo.
  View user's profile Private Nachricht senden
guuls
Threadersteller

Dabei seit: 03.09.2008
Ort: Mainhausen
Alter: 33
Geschlecht: Männlich
Verfasst Do 11.02.2010 22:08
Titel

Antworten mit Zitat Zum Seitenanfang

ja genau sowas meine ich
  View user's profile Private Nachricht senden
easteregg

Dabei seit: 15.02.2003
Ort: Deutschland
Alter: 36
Geschlecht: Männlich
Verfasst Do 11.02.2010 22:19
Titel

Antworten mit Zitat Zum Seitenanfang

Wie bereits gesagt:

jQuery plus das Plugin ScrollTo.

Das baust du beides bei dir ein. Dann gibst du dem Link, zu dem du "fliegend scrollen" willst eine eindeutige ID (doppelt gemoppelt, ich weiß...) und dem Link, bei dessen Klick man losfliegt, eine entsprechende Eigenschaft.
Z.B.
Code:
<a title="$.scrollTo( '#target-examples', 800, {easing:'elasout'} );" href="#target-examples">

In dem Beispielfall würde der Klick den User dann zu dem Abschnitt mit der ID "target-examples" fliegen lassen. Mehr, zu Einstellmöglichkeiten etc, erfährst du auf der Plugin-Seite.

Edit: Ups, in der Zwischenzeit hast du / wurde dein Beitrag, auf den ich mich bezog, gelöscht. Meine Güte!


Zuletzt bearbeitet von easteregg am Do 11.02.2010 22:20, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
guuls
Threadersteller

Dabei seit: 03.09.2008
Ort: Mainhausen
Alter: 33
Geschlecht: Männlich
Verfasst Do 11.02.2010 22:59
Titel

Antworten mit Zitat Zum Seitenanfang

Das funktioniert schon super!
Aber wie kann ich da jetzt noch die die Zeit einstllen?
Und vorallem wie mache ich das jetzt das man über das icon "up" nach oben scrollen kann?

Und was noch wichtiger ist wie mache ich das er von id zu id scrollt?


Zuletzt bearbeitet von guuls am Do 11.02.2010 23:00, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
easteregg

Dabei seit: 15.02.2003
Ort: Deutschland
Alter: 36
Geschlecht: Männlich
Verfasst Do 11.02.2010 23:03
Titel

Antworten mit Zitat Zum Seitenanfang

guuls hat geschrieben:
Das funktioniert schon super!
Aber wie kann ich da jetzt noch die die Zeit einstllen?
Und vorallem wie mache ich das jetzt das man über das icon "up" nach oben scrollen kann?

Der Wert 800 aus meinem Code-Beispiel müsste für die Zeit stehen (die vergeht, bis man an der Scrollposition ankommt). Der Wert durch 1000 geteilt ergibt die Sekunden, in dem Fall 0,8. Wenn du jetzt 5 Sekunden (als Beispiel) nehmen möchtest, wäre der Wert folgerichtig 5000.

Nach oben scrollen kannst du z.B., indem du dein erstes HTML-Element mit der ID "top" benennst. Dann wäre der Anker #top der, mit dem du nach oben scrollst.

Edit: Für ID zu ID - schau dir mal diese Demo-Beispiele an. Ich habe selber ScrollTo noch nie eingesetzt, daher lese ich mich da jetzt nicht für ein *zwinker*


Zuletzt bearbeitet von easteregg am Do 11.02.2010 23:04, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen PDF-Anker?
Probleme mit Anker
Anker- Problem im IE6 und IE7
Anker-Markierungen
anker in ein div container setzen?
Anker in HTML-Newsletter
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Programmierung


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.