简体   繁体   中英

How should I implement this jquery plug-in?

I'm using the jquery cycle plug-in to create a picture slideshow. It was super easy and I understand that code and I've gotten it to work on its own. But I'm trying to implement into an already existing website and am having some trouble. The website is broken up into separate files for the html, css, and then a js file.

This code is supposed to go within script tags in the head, but for purposes of the site it needs to go in the js file. I guess my question is do I need to do anything to the following code to make it ready to go in the js file, like put it in a function? I have tried just this without any luck. (And I have the jquery files loaded already).

$('.rotatorA').cycle({ fx: 'fade', timeout: 3000 });

$('.rotatorB').cycle({ fx: 'fade', delay: 1000, timeout: 3000 });

I'm fairly new to jquery and I haven't found much info on this, so I would really appreciate some help! Thanks!

Make sure it's in a document.ready callback, ie:

$(document).ready(function() {
    $('.rotatorA').cycle({ fx: 'fade', timeout: 3000 });
    $('.rotatorB').cycle({ fx: 'fade', delay: 1000, timeout: 3000 }); 
});

But that's needed regardless of whether it was in the <head> tag or in an external script...I mention it because maybe you left it out when copying the script?

FYI $(function() is available as an abbreviated version of $(document).ready(function()

Also make sure you don't have any other libraries like MooTools loaded. If that's the case then you need to modify your code somewhat and add a script with jQuery.noConflict() right after loading jQuery.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM