[gelöst] JavaScript (mit jQuery) einfügen, Anleitung für Anfänger
Eingetragen von albert39 (384)am 16.06.2010 - 15:22 Uhr in
Ich habe schon 2 Websites (Subthemes von ZEN) zu laufen gebracht, aber habe noch nie JavaScript eingesetzt. Nun möchte ich das >> jQuery corner plugin: simple corner rounding << (in http://github.com/malsup/corner/blob/master/jquery.corner.js) testen (also einfügen und aktivieren), habe mich auch mit den Grundzügen von jQuery (und JavaScript) über http://drupal.org/node/121997 vertraut gemacht, aber es fehlen mir ein paar grundsätzliche Infos, die offenbar so trivial sind, dass sie (zumindest nach 2 Tagen suchen) nicht zu finden waren.
Im Doku-Header des Scripts steht: >>* Requires jQuery v1.3.2 or later<<. Muß ich nun jQuery herunteladen *) und dann (wo ??) einfügen? Hat Drupal nicht schon jQuery implementiert? Wie sehe ich die Version? Welches Script muß ich im Info-File des Themes angeben (jQuery oder jquery.corner.js ?) In http://drupal.org/node/304255 (Adding JavaScript to your theme or module) gibt es Hinweise für Drupal 5.x und einige verwirrende Kommentare für 6.x. für den Einsatz von drupal_add_js(). Da ich die Ecken des Main-Content-Bereiches (div id="content") abrunden will, kommt der Script-Aufruf wahrscheinlich in die page.tpl.php hinein.
*) jquery.js habe ich gerade in /misc/ gefunden, aber es enthält nur 1 Anweisung eval(function(p,a,c,k,e,r){e=function(c){return(c
- Anmelden oder Registrieren um Kommentare zu schreiben
jQuery Update
am 16.06.2010 - 16:14 Uhr
Hallo Albert,
um jQuery 1.3.2 nutzen zu können, mußt du das Modul jQuery Update verwenden. Dabei ist wichtig, dass Du die Version 6.x-2.* verwendest (auch wenn deiese Version noch als alpha-Version gilt), weil nur dort auch jQuery in der Version 1.3.2 enthalten ist.
Die Query-Bibliothek muß nicht im Info-File erwähnt werden, da jQuery automatisch von Drupal und vom Update-Modul eingebunden werden.
Im Theme-Ordner mußt Du zusätzlich noch eine eigene JavaScript-Datei anlegen, die Deine jquery-Corner-Aufrufe enthält. Der Inhalt sollte zum Beispiel so aussehen:
Drupal.deinThemeNameInit= function() {
$("#DeineWunschElementID").corner();
$(".DeineWunschElementClass").corner();
};
if (Drupal.jsEnabled) {
$(document).ready(Drupal.deinThemeNameInit);
}
Im Info-File muß die jquery-corner.js und eine von Dir erstellte js-Datei angegeben werden.
Beispiel:
scripts[] = jquery.corner.jsscripts[] = DeinScript.js
In die page.tpl mußt Du somit dann nichts mehr einfügen, da ja Dein Skript automatisch mit eingebunden wird und dementsprechend auch die Corner-Funktionen automatisch aufgerufen werden.
Viel Spaß beim Testen.
Gruß,
Sven
Syntax für den Aufruf eines Scripts (jQuery)
am 17.06.2010 - 15:09 Uhr
Danke Sven.
Das jQuery-Update-Modul habe ich installiert. Dazu noch eine Frage für mein grundsätzliches Verständnis von Drupal: Ein automatisches Update von jQuery ist natürlich angenehm. Aber hätte ich nicht auch die letzte Version von jQuery (version 1.4.2) von http://jquery.com/ herunterladen und in misc/jquery.js speichern können? Hätte das dann funktioniert?
Da ich beim Lernen von JavaScript erst am Anfang bin, bitte ich Dich um Korrektur:
Ist für
Mit herzlichen Grüßen
Albert
Hallo nochmal
am 17.06.2010 - 15:44 Uhr
Hallo nochmal,
das jQuery-Update Modul bringt Drupal nur dazu, die jeweilige im Update-Modul enthaltene jQuery-Version zu verwenden. Das Modul führt kein automatisches Update mit im Internet verfügbaren jQuery-Versionen durch. Die 1.4.x Versionen werden dabei noch nicht im Update-Modul angeboten, da diverse andere Drupal-Module (inkl. einiger Module aus dem Drupal-Core-Paket) noch Probleme mit den neueren jQuery-Versionen haben. Daher ist für Drupal 6 derzeit jQuery 1.3.2 die neueste einsetzbare Version. Drupal 7 kommt wohl schon von Hause aus mit einer neueren jQuery-Version.
Dem Corner-Befehl mußt Du nur einen bei jQuery üblichen Selector übergeben. Das heißt eine ID oder eine CSS-Class des gewünschten abzurundenden Elements oder die Class mehrerer Elemente. Du meintest ursprünglich Du hättest ein div id="content" . Dementsprechend mußt Du
$(”#content”).corner();als Befehl aufrufen. Farben und Co. werden dann einfach aus dem Eltern-Element (also Deinem Div#content) ermittelt. Hier muß nicht separat eine CSS oder ähnliches übergeben werden.Gruß,
Sven
jQuery und JavaScript
am 18.06.2010 - 14:02 Uhr
Danke Sven!
Ich habe mit Deiner Hilfe schon einiges begriffen, aber da ich (in Zukunft) nicht nur irgendwas irgendwohin hineinkopieren, sondern verstehen möchte, was und wie etwas passiert, setze ich mich nun mit jQuery und JavaScript auseinander. Wenn ich dann wieder nach Hilfe schreie, mache ich das in einem neuen Thread mit einer präziseren Angabe des Problems.
Mit herzlichen Grüßen
Albert