jQuery: „localScroll is not a function“

 


Hyperdjango
Gast

26.01.11
07:48 Uhr
Okay, es ist gleich halb acht und ich bin durch. Habe übermorgen meine Bachelorpräsentation und soweit läuft auch alles gut, wenn da nicht dieses sogenannte jQuery wäre.
Hierbei handelt es sich um eine Präsentation über HTML5 (welche als HTML5 Website umgesetzt ist).

Die Slides werden mithilfe von jQuery und dem scrollTo + localScroll Plugin gesteuert und sollen beim Klick auf die Seitennavigation runter zum entsprechenden Anker sliden (Sollte ungefähr so aussehen).

Macht es auch. Allerdings nur lokal, sobald ich die Seite auf meinen Server aufrufe, sagt mir die Fehlerkonsole: „$(„#side“).localScroll is not a function“
Habe es auch mit meinem öffentlichen Ordner meiner Dropbox ausprobiert: Selbe Problem.

Vielleicht jemand eine Idee woran es liegen könnte? Zu finden ist die Seite hier: http://html5.florenz.co.uk
oder hier:
http://dl.dropbox.com/u/1807268/html5sit...media.html


Habe folgendes benutzt:
Boilerplate
jQuery
Prettify für Code Syntax (welches scheinbar online auch nicht funktioniert, wie ich gerade sehe) (....mhh...im Firefox 4 geht es nach etwas Ladezeit, Chrome nicht)
960 CSS
Sass CSS

Hier mal noch schnell mein Header:
  1. <script type="text/javascript" src="js/libs/modernizr-1.6.min.js"></script>
  2. <script type="text/javascript" src="js/libs/jquery-1.4.2.min.js"></script>
  3. <script type="text/javascript" src="js/libs/jquery.scrollTo-min.js"></script>
  4. <script type="text/javascript" src="js/libs/jquery.localscroll-min.js"></script>
  5. <script type="text/javascript" src="js/libs/jquery.easing.1.3.js"></script>
  6. <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=de"></script>
  7. <script src="js/mylibs/geo.js"></script>
  8. <script src="js/prettify/prettify.js"></script>
  9.  
  10. <script type="text/javascript">
  11. $(document).ready(function(){
  12. $("#side").localScroll({
  13. target:'#slidewrap',
  14. duration:2000,
  15. easing:'easeOutQuart'
  16. });
  17. });
  18. </script>
Quelltext in Zwischenablage kopieren

Ich hoffe hier weiss jemand Rat - bin jetzt seit 5 Uhr heute früh auf der Suche, am rumprobieren und am googlen, aber bislang wenig Erfolg.
Wie gesagt, ist sehr wichtig - vielleicht kann ich als Anreiz ja eine kleine Paypal Überweisung, einen Sechserträger ) oder sonst irgendwas anbieten (Nehme Wünsche entgegen)

Danke!
Florenz

PS: Ich hoffe ich hab jetzt nicht zu wirr geschrieben - bin definitiv zu lange wach
PS2: Die Seite ist noch nicht fertig, wie man sieht, viele Hackler und Fehler und CSS Schwachsinn, bitte nicht zuviel kritisieren )
Link zu diesem Beitrag in die Zwischenablage kopieren
Mister Ad
Werbung
Schon mal bei Zalando, Amazon oder eBay geguckt? Vielleicht wirst du dort fündig.

 
Hyperdjango
Gast

26.01.11
17:12 Uhr
ich bump das hier nochmal unfreundlich nach oben.
Hab das prettify inzwischen gelöst, lag an chmod,
aber localscroll ist immer noch keine Funktion. :/
Link zu diesem Beitrag in die Zwischenablage kopieren
semander
Gastarbeiter

26.01.11
18:17 Uhr
Hast du folgendes schon ausprobiert:

  • <script>-Tags ans Ende des Dokuments
  • $ mit jQuery ersetzen, also:

    1. jQuery.noConflict();
    2. jQuery(document).ready(function(){
    3. jQuery('#side').localScroll({
    4. target:'#slidewrap',
    5. duration:2000,
    6. easing:'easeOutQuart',
    7.  
    8. });
    9. });
    Quelltext in Zwischenablage kopieren
Link zu diesem Beitrag in die Zwischenablage kopieren
Hyperdjango
Gast

26.01.11
18:31 Uhr
semander schrieb am 26.01.11, 18:17 Uhr:

Hast du folgendes schon ausprobiert:

  • <script>-Tags ans Ende des Dokuments
  • $ mit jQuery ersetzen, also:

    1. jQuery.noConflict();
    2. jQuery(document).ready(function(){
    3. jQuery('#side').localScroll({
    4. target:'#slidewrap',
    5. duration:2000,
    6. easing:'easeOutQuart',
    7.  
    8. });
    9. });
    Quelltext in Zwischenablage kopieren


Ja, auch bereits gestern ausprobiert (gerade nochmal) - Leider liegt es auch nicht daran.
http://html5.florenz.co.uk/4webapps.html

Hier nochmal eine Fehlermeldung:
  1. index.html:32Uncaught TypeError: Object #<an Object> has no method 'localScroll'
  2. (anonymous function)index.html:32
  3. c.b.extend.readyjs/libs/jquery-1.4.2.min.js:29
  4. c.ujs/libs/jquery-1.4.2.min.js:37
Quelltext in Zwischenablage kopieren

Weitere Vorschläge?
Link zu diesem Beitrag in die Zwischenablage kopieren
trulla
Stammgast

27.01.11
12:54 Uhr
Editiert: 27.01.11, 14:19 Uhr
noConflict Modus ist eher nicht so sinnvoll: Du benutzt ja keine andere Library außer jQuery. Da kommt sich also eigentlich nichts ins Gehege.

Was sein kann (bzw. wahrscheinlich der Fall ist) ist, dass localScroll entweder zu langsam nachgeladen oder zu langsam ausgeführt wird: das heißt die Ladereihenfolge der Scripte lässt nicht zu, dass du localScroll schon zum Zeitpunkt des DOMReady ausführst.
Zudem kannst du mal versuchen das easing (easinOutQuart) erst mal in eins zu ändern, dass von haus aus dabei ist (linear oder swing).

Was wahrscheinlich hilft, ist die Scripte nacheinander zu laden und jeweils zu warten bis sie wirklich da sind. Das kannst du mit der Funktion getScript tun. Zusätzlich kannst du überprüfen ob $.localScroll als Funktion überhaupt schon existiert (wenn nicht, ist sie noch nicht fertig geladen) und ggf. einen timer starten, der das zyklisch wiederholt und die Funktion erst dann ausführt.

Hier mal schnell hingedengelt:



  1. <script type="text/javascript" src="js/libs/jquery-1.4.2.min.js"></script>
  2. <script type="text/javascript" src="js/libs/jquery.easing.1.3.js"></script>
  3. <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=de"></script>
  4. <script src="js/mylibs/geo.js"></script>
  5. <script src="js/prettify/prettify.js"></script>
  6.  
  7. <script type="text/javascript">
  8. $(document).ready(function(){
  9. $.getScript('js/libs/jquery.localscroll-min.js',function() {
  10. $.getScript('js/libs/jquery.scrollTo-min.js"', function() {
  11. initLocalScroll();
  12. })
  13. });
  14.  
  15. });
  16. function initLocalScroll() {
  17. if(typeof($.localScroll) != 'undefined') {
  18. $("#side").localScroll({
  19. target:'#slidewrap',
  20. duration: 2000,
  21. easing:'easeOutQuart'
  22. });
  23. } else {
  24. window.setTimeout('initLocalScroll',500);
  25. }
  26. }
  27. </script>
Quelltext in Zwischenablage kopieren


Tip am Rande: Ich packe immer ALLE genutzten Plugins in EINE Datei und führe meine Funktionen die Plugins benutzen erst dann aus, wenn diese Datei geladen wurde (ähnlich wie oben... nur komfortabler).
Und ein weiterer Tip: Füge alle Scripte außer Modernizr am ENDE deiner Datei (vor den schließenden BODY Tag) ein. Damit wird erst die Seite geladen und dann erst die Scripte. Das hilft bei der gefühlten Ladezeit und kann dir ggf. auch warten auf domready ersparen, da das HTML an diesem Punkt schon komplett eingelesen wurde und im DOM existiert.
Link zu diesem Beitrag in die Zwischenablage kopieren
Hyperdjango
Gast

09.02.11
01:43 Uhr
Hi,
sorry dass ich erst jetzt wieder vorbeischaue. Die Antwort kam damals ca 5 Stunden zu spät, habs aber einigermaßen hinbekommen (1,0) und danach wollte ich an das ganze Thema erstmal keine weiteren Gedanken mehr verschwenden.

Werde deine Tipps bei Gelegenheit mal ausprobieren - denke sogar dass es wirklich helfen wird. Wie in Beitrag #1 versprochen - ...was kann ich dir Gutes tun, Trulla?
Link zu diesem Beitrag in die Zwischenablage kopieren
trulla
Stammgast

10.02.11
11:48 Uhr
och nix. ich habe ein helfersyndrom und bin froh, wenn ich mein wissen teilen kann -)
Link zu diesem Beitrag in die Zwischenablage kopieren
Hyperdjango
Gast

10.02.11
13:58 Uhr
Okay, bin ich ja billig davon gekommen.
Ansonsten, falls dich die Materie interessiert, hier ist meine komplette Arbeit. Evtl. willst dir ja einen kleinen Überblick verschaffen und dir ist Rechtschreibung egal ;)
http://dl.dropbox.com/u/1807268/html5_re..._final.pdf ()

Gruss
Link zu diesem Beitrag in die Zwischenablage kopieren
trulla
Stammgast

10.02.11
14:33 Uhr
Haha. Habe ich bereits aus dem HTML5 Thread heruntergeladen. Bisher habe ich es nur quer gelesen: Ist aber scheinbar eine schöne Zusammenfassung.
Ich hab's intern für die weniger autodidaktisch veranlagten Frontendler/Designer schon mal als Leseempfehlung weitergeleitet. Somit wäre ja die „Vergütung“ eigentlich auch erledigt ;)
Link zu diesem Beitrag in die Zwischenablage kopieren
Hyperdjango
Gast

10.02.11
23:26 Uhr
Oooookay, hätte gedacht, dass ich dieses wohl nie wieder brauche, aber falsch. Gerade zum zweiten Mal auf ein „not a function“ gestoßen (mit masonry.js) - und schnell das getscript ausprobiert - klappt 1A.

Thx again - hast mir gerade eine Menge Zeit gespart
Link zu diesem Beitrag in die Zwischenablage kopieren
 
#