Jump to:

23486 Posts in 18995 Topics by 2878 members

General Questions

SilverStripe Forums » General Questions » jQuery Cycle Lite Plugin and SilverStripe

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1 2
Go to End
Author Topic: 10063 Views
  • squap
    Avatar
    Community Member
    9 Posts

    jQuery Cycle Lite Plugin and SilverStripe Link to this post

    Hi,

    I'm trying to use the jQuery Cycle Lite Plugin in SilverStripe.
    I'm going to describe the steps I took. Maybe someone can tell me what I missed.

    1. put jquery.cycle.lite.js and jquery-1.3.2.js in mysite/javascript
    2.

          Requirements::javascript("mysite/javascript/jquery-1.3.2.js");
          Requirements::javascript("mysite/javascript/jquery.cycle.lite.js");


    in Page_Controller
    3. in Page.ss put

    <script type="text/javascript" src="mysite/javascript/jquery.cycle.lite.js"></script>
    <script type="text/javascript" src="mysite/javascript/jquery-1.3.2.js"></script>
    <script type="text/javascript">
    $(function() {
    $('#slideshow1').cycle();
    });
    </script>


    in the Header
    4. in the Body:

       <div id="slideshow1" class="pics">
       <img style="display: block; z-index: 3; opacity: 1;" src="themes/BrightSide1/images/madrid1.jpg" width="820" height="120" />
       <img style="display: none; z-index: 2; opacity: 0;"src="themes/BrightSide1/images/madrid2.jpg" width="820" height="120" />
       <img style="display: none; z-index: 1; opacity: 0;"src="themes/BrightSide1/images/madrid3.jpg" width="820" height="120" />
       </div>

    As a result the first picture is shown, but the images are not "cycled".

    Thanks.

  • Invader_Zim
    Avatar
    Community Member
    141 Posts

    Re: jQuery Cycle Lite Plugin and SilverStripe Link to this post

    Hi,

    i think you are including your scripts twice.

    If you use Requirements::... in your Page_Controller, it's imho unnecessary to include jquery-1.3.2.js and jquery.cycle.lite.js in Page.ss again.

    Maybe that's the problem...

    Cheers,
    Christian

  • squap
    Avatar
    Community Member
    9 Posts

    Re: jQuery Cycle Lite Plugin and SilverStripe Link to this post

    Thanks for the answer, but that was not it.

    I tried using the Requirements:: in Page_Controller OR included them in Page.ss head, but it still doesn't work.

    Any other suggestions ?

    If I try it without SilverStripe in an isolated HTML file it works fine ...

  • squap
    Avatar
    Community Member
    9 Posts

    Re: jQuery Cycle Lite Plugin and SilverStripe Link to this post

    So I let it run through Firebug and it looks as if all the "imports" work fine and it fails to find :

    <div id="slideshow"


    Firebug says:

    $("#slideshow") is null
    http://localhost/silverstripe/?flush=1
    Line 8

    That is weird because I do exactly the same as in an isolated HTML file ...

    Here is my Page.ss : http://pastebin.com/m4c06e28e
    Here is the working HTML : http://pastebin.com/m11de72ec

    Hopefully someone sees what I'm missing ...

  • Invader_Zim
    Avatar
    Community Member
    141 Posts

    Re: jQuery Cycle Lite Plugin and SilverStripe Link to this post

    Hmm, strange...

    I once had a problem with the jquery thickbox plugin.
    It worked on a static site, but not in SilverStripe (SS v 2.2.3) with exactly the same code.

    Then somebody told me to blame the ContentNegotiator and to disable it by adding ContentNegotiator::disable(); to mysite/_config.php, and everything was ok...

    Cheers,
    Christian

  • squap
    Avatar
    Community Member
    9 Posts

    Re: jQuery Cycle Lite Plugin and SilverStripe Link to this post

    Thanks, but it still doesn't work. I tried both ContentNegotiator::disable(); and ContentNegotiator::enable();

    I am still getting :

    $("#slideshow") is null


    although it definitely exists.

  • banal
    Avatar
    Community Member
    901 Posts

    Re: jQuery Cycle Lite Plugin and SilverStripe Link to this post

    Hm. Try the following, just for testing:

    jQuery(document).ready(function () {
    jQuery('#slideshow').cycle();
    });

  • squap
    Avatar
    Community Member
    9 Posts

    Re: jQuery Cycle Lite Plugin and SilverStripe Link to this post

    Thanks very much, that was it !
    Why does it not work like this ? (just being curious):

    $(function() {
    $('#slideshow1').cycle();
    });

    10063 Views
Page: 1 2
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.