Solved: Re: How to get an external jQuery plugin running in Tiki?
S O L V E D
Hi Rick, thank you for your kind reply. Actually the issue could be solved with the help of Jyhem - Jean-Marc.
He realised (by using the Firebug Tool), that the script was running aready, but an error was stooping it before triggering the first slider change ..visually the slideshow appeared static, whilst it was running already.
Jyhem gabe me some advice later how to use the Firebug for JavaScript stuff, an area where I am not so much experienced ...
So what was the error?
The wrong code:
$.getScript('responsiveslider/responsiveslides.min.js', function() { $(function() { $(".rslides").responsiveSlides(); auto: true, // Boolean: Animate automatically, true or false speed: 1200, // Integer: Speed of the transition, in milliseconds timeout: 8000, // Integer: Time between slide transitions, in milliseconds pager: false, // Boolean: Show pager, true or false nav: false, // Boolean: Show navigation, true or false
Especially the end of this line, before the options:
$(".rslides").responsiveSlides(); auto: true,
A simple bracket (open+close) is missing:
$(".rslides").responsiveSlides() { auto: true, etc. ... });
And one fuction call was doubled and placed wrong:
$.getScript('responsiveslider/responsiveslides.min.js', function() { $(function() {
The full code in a custom module:
{jq}$.getScript('responsiveslider/responsiveslides.min.js', function() { $(".rslides").responsiveSlides({ auto: true, // Boolean: Animate automatically, true or false speed: 1200, // Integer: Speed of the transition, in milliseconds timeout: 8000, // Integer: Time between slide transitions, in milliseconds pager: false, // Boolean: Show pager, true or false nav: false, // Boolean: Show navigation, true or false random: false, // Boolean: Randomize the order of the slides, true or false pause: false, // Boolean: Pause on hover, true or false pauseControls: false, // Boolean: Pause when hovering controls, true or false prevText: "Previous", // String: Text for the "previous" button nextText: "Next", // String: Text for the "next" button maxwidth: "", // Integer: Max-width of the slideshow, in pixels navContainer: "", // Selector: Where controls should be appended to, default is after the 'ul' manualControls: "", // Selector: Declare custom pager navigation namespace: "rslides", // String: Change the default namespace used before: function(){}, // Function: Before callback after: function(){} // Function: After callback });});{/jq} Sorry, the CKE Editor does not let me show the html content in the code plugin! OUCH! Anyway, here you just put an ul open then the list elements and then ul closed. In the li you can include img plugins and text and even ith the wiki tag and the literal tag arbitrary wikisyntax.
Please mind, that this can be used aswell on a wiki page, but with a little change:
1.) use a different syntax for the plugin:
{JQ()}$.getScript('responsiveslider/responsiveslides.min.js', function() { $(".rslides").responsiveSlides({ auto: true, etc. ... });{JQ}
etc.
after: function(){} // Function: After callback }); });
2.) and wrap the HTML tags in an HTML wiki plugin:
{HTML()} Sorry, the CKE Editor does not let me show the html content in the code plugin! OUCH! Anyway, here you just put an ul open then the list elements and then ul closed. In the li you can include img plugns and text and even ith the wiki tag and the literal tag arbitrary wikisyntax. {HTML}
Hint:
If the jQuery plugin is used in a custom module, it is easily possible to use wiki syntax inside the li tags and thus optionally slide arbitrary wiki content instead or additionally to images.
Info:
My use of this method (wiki page or custom module) DOES NOT MEAN that other methods like adding to the headerlib in either tiki-setup.php or in a template would not work. I aswell have not yet evaluated the methods in Admin -> Look and Feel -> Customisation .
As I have now a proven working example, I will try to get all different methods to use external (non-legacy) jQuery plugins working and then provide a documentation about it, including a matrix about advantages and disaadvantages of the varius methods.
What I would find really cool, would be the use of the .j file from a Tiki file gallery ... I do not believe, that this could work, but I cross fingers and will test anyway.
Best regards,
Torsten
;){kind=link}
;){kind=link}