mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Mo 28.04.2025 21:05 Benutzername: Passwort: Auto-Login

Thema: ScrollToAnchors mit jQuery vom 12.09.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> ScrollToAnchors mit jQuery
Seite: 1, 2  Weiter
Autor Nachricht
Kalle Bowo
Threadersteller

Dabei seit: 27.11.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Sa 12.09.2009 23:26
Titel

ScrollToAnchors mit jQuery

 Antworten mit Zitat Zum Seitenanfang
Hallo Leute,
ich probier jetzt schon seit Stunden so einen schönen smoothen Scroll-Effekt zu einem Anker hinzubekommen wie er auf dieser Seite verwendet wird, aber irgendwie funzt es nich. Durch Recherche bin ich schon soweit gekommen, dass das ganze mit jQuery möglich ist. Dort gibts diese schöne ScrollToAnchors Funktion, mit der eigentlich alles läuft. Tut es aber nicht, hab schon x verschiedene Varianten und Scripte ausprobiert. Da ich aber Neuling mit jQuery bin, scheine ich immer wieder irgendeinen dusseligen Fehler zu machen, der mir die Funktion versaut...

Wenn sich jemand damit auskennt, könntest du vielleicht eine ganz kleine Datei erstellen mit solch einer smoothen Scroll-To-Anchor-Funktion, die auch läuft? Damit ich sehe, was ich verkehrt mache.

Danke vielmals,
Kalle
  View user's profile Private Nachricht senden
vktr.nm

Dabei seit: 21.07.2006
Ort: im bezaubernden dresden
Alter: 39
Geschlecht: Männlich
Verfasst So 13.09.2009 11:47
Titel

Antworten mit Zitat Zum Seitenanfang
Also bei mir funzt es! Klick ich auf "interaktiv" wird bis dahin "gescrollt" ... usw.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Kalle Bowo
Threadersteller

Dabei seit: 27.11.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst So 13.09.2009 14:53
Titel

Antworten mit Zitat Zum Seitenanfang
Hast du dann mal n Codeschnipsel für mich? Au weia!
  View user's profile Private Nachricht senden
Eistee
Administrator

Dabei seit: 31.10.2001
Ort: Grimma
Alter: 46
Geschlecht: Männlich
Verfasst So 13.09.2009 15:29
Titel

Antworten mit Zitat Zum Seitenanfang
Wie sieht denn dein eigener Versuchscode aus?
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Kalle Bowo
Threadersteller

Dabei seit: 27.11.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst So 13.09.2009 15:53
Titel

Antworten mit Zitat Zum Seitenanfang
Wie gesagt, ich hab verschiedene Versuche gemacht und dabei auf verschiedene js-Dateien verwiesen. Hier ist ein Beispiel.

Code:
  <html>
<head>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="scrollto.js"></script>


    <script type="text/javascript">
           // Hier kommt dein Code rein
       
             $("body").ScrollToAnchors(800);
   
           });
       
    </script>
   
   
</head>
<body>
  <p><a href="#anker-unten">Geh nach unten, muha</a></p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>a</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p>aaaa</p>
  <p><a name="anker-unten">aaaa</a></p>
</body>
  </html>



Im Head-Bereich verweise ich auf die js-Datei, quasi die Bibliiothek mit all den tollen jQuery-Funktionen, oder trage selber einen bestimmten Code für einen betimmten Effekt ein, und dann sollte eigentlich jeglicher Link zu einem Anker im Body-Bereich animiert scrollen. So hab ichs zumindest verstanden ... hab da bestimmt was verkehrt verstanden, ich weiss eben nur nich was Au weia! Vermutlich muss ich doch bei jedem <a href="#xyz"></a> noch etwas anderes hinschreiben oder der im Head-Bereich aufgeführte Code ist fehlerhaft. Ich dreh mich jedenfalls grad im Kreis...
  View user's profile Private Nachricht senden
denise2302

Dabei seit: 12.09.2006
Ort: Leipzig
Alter: 35
Geschlecht: Weiblich
Verfasst Mo 14.09.2009 14:53
Titel

Antworten mit Zitat Zum Seitenanfang
Code:

<script type="text/javascript">
           // Hier kommt dein Code rein
       
             $("p").ScrollToAnchors(800);
   
           });
       
    </script>


so vll?

Zuletzt bearbeitet von denise2302 am Mo 14.09.2009 14:53, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Kalle Bowo
Threadersteller

Dabei seit: 27.11.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 14.09.2009 17:38
Titel

Antworten mit Zitat Zum Seitenanfang
Dank dir, Denise, klappt aber och nich ... hmz.

Noch jemand ne Idee?
  View user's profile Private Nachricht senden
choise

Dabei seit: 01.02.2007
Ort: Würzburg
Alter: 36
Geschlecht: Männlich
Verfasst Mo 14.09.2009 18:12
Titel

Antworten mit Zitat Zum Seitenanfang
ich kann jetzt nur mutmaßen, da ich das scrolltojs nicht kenne. haste mal n link?

aber probiers mal so, das oben ist alleine schon syntaktisch alles murks

Code:

<html>
   <head>
      <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
      <script type="text/javascript" src="scrollto.js"></script>
      <script type="text/javascript">
         $(document).ready(function(){
            $('#oben').ScrollToAnchors(800);
         });
      </script>
   </head>
   <body>
   <a href="#anker-unten" id="oben">Geh nach unten</a>
   <p></p>
   .....
   <p></p>
   <a name="anker-unten" id="anker-unten">aaaa</a>
   </body>
</html>



genau wissen kann ichs nich, da ich nich weiss wie die scrolltoanchors.js aussieht.

Zuletzt bearbeitet von choise am Mo 14.09.2009 18:13, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen jQuery Plugin - Slider als Input wie in jQuery UI
jquery - hide content in jquery object
jQuery
jQuery 1.4
Div's ein- und ausblenden mit jquery o.ä.
JS/jQuery Layer
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.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB