Method returns boolean value which determines whether a slide is opening or closing.
1) Method can be called inside every callback (as demonstrated in demo 1):
this.isAnimated();
2) In case there is only one HTML element matching the selector, method can be called anywhere in your code (as demonstrated in demo 2):
$('selector').data('jAccordion').isAnimated();
3) In case there are more HTML elements matching the selector, method can be called anywhere in your code (eq(index) specifies index of accordion instance):
$('selector').eq(index).data('jAccordion').isAnimated();
<div class="accordion noJS"> <div class="preloader">Loading content...</div> <div class="jAccordion-slidesWrapper"> <div class="jAccordion-slide"><img src="images/banner1.png" width="910" height="380" alt="slide1" /></div> <div class="jAccordion-slide"><img src="images/banner2.png" width="910" height="380" alt="slide2" /></div> <div class="jAccordion-slide"><img src="images/banner5.png" width="910" height="380" alt="slide3" /></div> <div class="jAccordion-slide"><img src="images/banner3.png" width="910" height="380" alt="slide4" /></div> <div class="jAccordion-slide"><img src="images/banner4.png" width="910" height="380" alt="slide5" /></div> </div> </div>
jQuery(document).ready(function( $ ) { $('.accordion').jAccordion({ onReady : function() { $('.preloader', this.$accordion).remove(); }, onSlideStartOpening : function(e) { alert('onSlideStartOpening - animated: ' + this.isAnimated()); }, onSlideOpened : function(e) { alert('onSlideOpened - animated: ' + this.isAnimated()); } }); });
Demo 1 demonstrates how to call the described method inside callbacks attached to events onSlideStartOpening and onSlideOpened (the protocol is the same for all callbacks). Open a slide by moving cursor over it and look at the report displayed below accordion. The report consists of name of the event and result of calling the described method which indicates whether a slide is opening or closing.
<div class="accordion noJS"> <div class="preloader">Loading content...</div> <div class="jAccordion-slidesWrapper"> <div class="jAccordion-slide"><img src="images/banner1.png" width="910" height="380" alt="slide1" /></div> <div class="jAccordion-slide"><img src="images/banner2.png" width="910" height="380" alt="slide2" /></div> <div class="jAccordion-slide"><img src="images/banner5.png" width="910" height="380" alt="slide3" /></div> <div class="jAccordion-slide"><img src="images/banner3.png" width="910" height="380" alt="slide4" /></div> <div class="jAccordion-slide"><img src="images/banner4.png" width="910" height="380" alt="slide5" /></div> </div> </div> <button id="demonstrationBtn" disabled="disabled">Loading...</button>
jQuery(document).ready(function( $ ) { $('.accordion').jAccordion({ transitionSpeed : 2000, onReady : function() { $('.preloader', this.$accordion).remove(); $('#demonstrationBtn').text('Is any slide opening/closing?').removeAttr('disabled'); } }); $('#demonstrationBtn').click(function() { var isAnimated = $('.accordion').data('jAccordion').isAnimated(); alert(isAnimated ? "Animation in progress" : "There is no animation."); }); });
Demo 2 demonstrates how to call the described method anywhere in your code.
jAccordion by maniacpc, exclusively for CodeCanyon