Problem bei der Einbindung von jquery
Eingetragen von doca (16)am 12.05.2011 - 00:43 Uhr in
Hallo Drupaler,
ich starte gerade einen ersten Versuch ein Template mit Jquery zu tunen und versage bisher kläglich. Folgendes habe ich vor:
In die page.tpl.php meines Themes habe ich ein zusätzliches Element eingefügt. Der Sinn von dem Ganzen: Links am Rand soll sich ein Tab ausfahren. Hier ist das Element:
<ul id="callback">
<li class="home"><a href="" title="Rückruf">Rückruf</a>
</li>
</ul>Die Styles funktionieren und sind in der css Datei integriert.
Nun das Problem: Folgenden Javascriptcode muss ich einbinden:
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function() {
$('#callback a').stop().animate({'marginLeft':'-85px'},1000);
$('#callback > li').hover(
function () {
$('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
},
function () {
$('a',$(this)).stop().animate({'marginLeft':'-85px'},200);
}
);
});
</script>Wie funktioniert das praktisch? Brauche ich die oben eingebundene jquery Datei oder sind die Funktionen in Drupal vorhanden? Ich habe bereits eine eigene .js Datei erstellt die wie folgt aussieht:
$(function() {
$('#callback a').stop().animate({'marginLeft':'-85px'},1000);
$('#callback > li').hover(
function () {
$('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
},
function () {
$('a',$(this)).stop().animate({'marginLeft':'-85px'},200);
}
);
});Diese habe ich in der .info Datei integriert.
Was vom javascript muss in die page.tpl.php?
Rätsel, Rätsel
Kann mir jemand helfen...ich verzweifele ;)
- Anmelden oder Registrieren um Kommentare zu schreiben
just found the answer: die
am 12.05.2011 - 01:13 Uhr
just found the answer:
die eingebundene .js datei muss mit der Funktion
(function ($) {// All your code here
}(jQuery));
eingebunden werden. Das Ganze sieht dann so aus:
(function ($) {
$(function() {
$('#callback a').stop().animate({'marginLeft':'-85px'},1000);
$('#callback > li').hover(
function () {
$('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
},
function () {
$('a',$(this)).stop().animate({'marginLeft':'-85px'},200);
}
);
});
}(jQuery));
jquery liegt drupal bereits
am 12.05.2011 - 02:20 Uhr
jquery liegt drupal bereits bei und deine eigene js datei solltest du über die info-datei deines themes einbinden.
Die jQuery-Bibliothek selbst
am 12.05.2011 - 08:34 Uhr
Die jQuery-Bibliothek selbst solltest du nicht mit einbinden, da kann es evtl. zu Konflikten kommen, weil Drupal selbst schon eine jQuery-Bibliothek mitbringt.