I'm currently facing the challenge of combining two WordPress plugins without the need to modify one to fit into the other seamlessly.
My main question is: How can I call a function from one plugin that exists outside of another plugin? For example, I have two files:
1) js/N_Rotator.js
2) js/layerSlider.js
Both of them are working correctly. The first one rotates images in the background while the second one rotates content such as titles, images, links, etc.
What I aim to achieve is synchronization between the two. When slider 2 rotates, I want slider 1 to rotate as well.
After some investigation, I discovered that I could trigger Slider 1 from Slider 2 like this:
a('#carousel').infiniteCarousel({ anim('next'); });
However, I encountered an error stating that `anim()` does not exist. Therefore, I moved it inside a variable within the javascript file for slider 1.
if(o.play) {
anim('next');
}
Then, I called it from slider 2 in this manner:
a('#carousel').infiniteCarousel({ play:1 });
Unfortunately, all this does is reset the rotation every time it's initiated. It slides once and snaps back to the starting position.
Is there a way to call the function independently? Here is how `anim()` is structured (taken from a previously developed plugin named infiniteCarousel).
function anim(direction,dist)
{
// Implementation details are mentioned here...
}
The plugin structure looks like this:
(function($) {
$.fn.extend({
infiniteCarousel: function(options) {
var defaults = {
defaults...
};
var options = $.extend(defaults, options);
return this.each(function() { ...the definition of anim is placed inside here... }); })(jQuery);
Any suggestions on how I can invoke the function without re-initializing the plugin?
Please note that I cannot share the link to the website as it is still under development and confidentiality needs to be maintained. Ideally, showing you a live example would be more helpful.