Frage zu CrossSlide jQuery Plugin
Eingetragen von travel-pictures (156)am 11.08.2008 - 20:43 Uhr in
Auf der Seite http://www.gruppo4.com/~tobia/cross-slide.shtml habe ich ein Plugin für jQuery gefunden, das ich gerne einsetzen möchte. Folgende Grundvoraussetzungen:
* Installiert sind die Module: jQuery Plugins, jQuery UI, jQuery Update,
* das jquery-cross-slide.js habe ich in files abgelegt und in dem Theme direkt unter
<?php
print $scripts;
?>ZIEL: ich möchte innerhalb einer Page diesen Effekt mit einer kleinen Slideshow einbinden.
Also habe ich mir den Quellcode von http://www.gruppo4.com/~tobia/cross-slide.shtml angeschaut und folgende Sektion gefunden:
<h3>Slide + cross-fade</h3>
<style type="text/css">
#test1 {
margin: 1em auto;
border: 2px solid #555;
width: 550px;
height: 200px;
}
</style>
<script type='text/javascript' id='source-test1'>//<![CDATA[
$(function() {
$('#test1').crossSlide({
speed: 45, //px/sec
fade: 1 //sec
}, [
{ src: 'lib/1.jpeg', dir: 'up' }, //sand castle
{ src: 'lib/2.jpeg', dir: 'down' }, //sunflower
{ src: 'lib/3.jpeg', dir: 'up' }, //flip flops
{ src: 'lib/4.jpeg', dir: 'down' } //rubber ring
]);
});
//]]></script>Das habe ich dann in den Content-Block kopiert und die Pfade für die Bilddatei angepasst und auf Full-HTML gestellt.
Aber es passiert nix!
Auf besagter Website steht noch, dass man einen "DOM-ready Handler" braucht, der aufgerufen wird mit:
jQuery(function($) {
//put your jQuery code here
});Also habe ich "$(function()" durch "jQuery(function($)" ersetzt, was allerdings auch nicht zum Erfolg geführt hat.
Es gibt zwei Möglichkeiten:
* ich habe das Ganze falsch aufgerufen (wie geht das dann richtig??)
* man kann kein Java-Script in Content aufrufen (gibt es ein Modul dafür??)
Für sachdienliche Hinweise bin ich dankbar.
Grüße,
Holger
- Anmelden oder Registrieren um Kommentare zu schreiben
Kann mir niemand sagen, ob
am 12.08.2008 - 09:32 Uhr
Kann mir niemand sagen, ob man jQuery (wie oben beschrieben) bzw. Java-Script im Content ausführen lassen kann?
---
http://travel-pictures.net
folge meinen jQuery Beiträgen so wirst Du Erleuchtung finden
am 12.08.2008 - 09:58 Uhr
Ja man kann jQuery im Content ausführen lassen.
Für Tipps dazu begib Dich auf die Startseite von Drupalcenter und folge meinen jQuery Beiträgen so wirst Du eine Erleuchtung finden.
-------------
quiptime
Nur tote Fische schwimmen mit dem Strom.
Dann werde ich dem Pfad der
am 12.08.2008 - 10:04 Uhr
Dann werde ich dem Pfad der Erleuchtung mal folgen :)
Ich habe auch noch einen Beitrag gefunden, der wohl dasselbe anspricht: http://www.drupalcenter.de/node/8533
---
http://travel-pictures.net
GELÖST: Frage zu CrossSlide jQuery Plugin
am 13.08.2008 - 09:30 Uhr
http://www.drupalcenter.de/node/8533
hat die Lösung gebracht. Ich habe es ein wenig angepasst:
* Einbinden des Java-Scripts direkt in die page.tpl.php
Danach folgenden Code in den Content geworfen:
<?phpdrupal_add_js ('misc/jquery.cross-slide.js');
$nextjs = "$(document).ready( function(){
$('#test3').crossSlide({
fade: 1
}, [
{
src: 'files/frontpage-show/Dead-Vlei.jpg',
from: '100% 80% 1x',
to: '100% 0% 1.7x',
time: 9
}, {
src: 'files/frontpage-show/Elefantenruessel.jpg',
from: 'top left',
to: 'bottom right 1.5x',
time: 9
}, {
src: 'files/frontpage-show/Gepard.jpg',
from: '100% 80% 1.5x',
to: '80% 0% 1.1x',
time: 9
}, {
src: 'files/frontpage-show/Giant-Kingfisher.jpg',
from: '100% 50%',
to: '30% 50% 1.5x',
time: 9
},
{
src: 'files/frontpage-show/Giraffe.jpg',
from: '100% 80% 1x',
to: '100% 0% 1.7x',
time: 9
}, {
src: 'files/frontpage-show/lilac-breasted-roller.jpg',
from: 'top left',
to: 'bottom right 1.5x',
time: 9
}, {
src: 'files/frontpage-show/Pavian-mit-Jungem.jpg',
from: '100% 80% 1.5x',
to: '80% 0% 1.1x',
time: 9
}, {
src: 'files/frontpage-show/Perlhuhn.jpg',
from: '100% 50%',
to: '30% 50% 1.5x',
time: 9
}, {
src: 'files/frontpage-show/spielender-Pavian.jpg',
from: '100% 80% 1.5x',
to: '80% 0% 1.1x',
time: 9
}, {
src: 'files/frontpage-show/zwei-Elefanten.jpg',
from: '100% 50%',
to: '30% 50% 1.5x',
time: 9
}
]);
});
//]]";
drupal_add_js($nextjs, 'inline');
?></p>
<div id="test3">Loading...</div>
Der style.css habe ich noch erweitert um:
div#test3{width: 400px;
height: 250px;
margin: 1em auto;
}
Da war es...
Grüße,
Holger
---
http://travel-pictures.net
Leider funktioniert das bei
am 20.08.2008 - 12:12 Uhr
Leider funktioniert das bei mir so nicht.
Ich möchte aus den Bildern vom User ein paar Bilder in seiner Usernode so anzeigen. Also muss dieser Code auch direkt irgendwie in die entsprechenden template-dateien.
Ich habe mir nun die ganze Nacht um die Ohren geschlagen, leider ohne Erfolg. Vielleicht weiss ja jemand Rat. Ich vermute, dass es probleme mit dem Einbinden der jquery.cross-slide.js gibt !???!!
-------------------
gruss
drupalino
* Immanent wichtig ist, dass
am 20.08.2008 - 14:50 Uhr
* Immanent wichtig ist, dass im div vorher Höhe und Breite definiert sind.
* Ich habe die cross-slide.js direkt in der page.tpl.php eingetragen
Leider fehlt mir an dieser Stelle die Erfahrung, ob du dieses Skript 1:1 in das Template packen kannst. Vielleicht weiß das jemand hier im Forum.
---
Hobby: travel-pictures.net
Company: Konzept360
selbst das habe ich gemacht,
am 20.08.2008 - 15:08 Uhr
selbst das habe ich gemacht, jetzt wird nur das erste Image angezeigt, weiter passiert aber nichts!
-------------------
gruss
drupalino
das klingt für mich aber
am 21.08.2008 - 08:08 Uhr
das klingt für mich aber eher wie ein Tippfehler in dem Script, wenn nur ein Bild angezeigt wird. vielleicht checkst du auch noch mal die Dateirechte oder ob das Bildformat nicht korrupt ist.
---
Hobby: travel-pictures.net
Company: Konzept360
Na das passt alles. auch
am 21.08.2008 - 14:38 Uhr
Na das passt alles. auch wenn ich das gleiche bild mehrfach einbinden will, was ja auch gehen sollte. tut sich nichts, zumindest müsste dann dieses einzelne bild über sich selbst "gefadet" werden
-------------------
gruss
drupalino
Hi, ich hätte da auch ein
am 12.09.2008 - 10:04 Uhr
Hi,
ich hätte da auch ein Problem mit dem CrossSlide Plugin.
Als ich es ausprobiert hatte, in einer .html Seite, hat es sehr zufriedenstellend funktioniert. Seit dem es dann jedoch, auf einer andere Seite, in eine .js Datei eingefügt wurde, funktioniert es nicht mehr. Es wurde alles 1:1 kopiert und die Links, für die Bilder, wurden angepasst. Es wird immer nur das erst Bild angezeigt, ohne Bewegung. Das erste Bild ist visible, die anderen sind hidden, alle position: absolute;. Die Angaben in CSS wurden ebenfalls übernommen. Das Plugin steht mit in der js Datei.
Ich habe echt keine Ahnung, wieso es nicht funktioniert. Ich hoffe, ihr könnt mir helfen.
Vielen Dank.
-weidc
Ja man kann jQuery im
am 12.12.2008 - 12:42 Uhr
Ja man kann jQuery im Content ausführen lassen.
Für Tipps dazu begib Dich auf die Startseite von Drupalcenter und folge meinen jQuery Beiträgen so wirst Du eine Erleuchtung finden.
_______________________
http://www.oyunstar.net