Make a jquery img cycle animation dissapear
I am using a Jquery Cycle Plugin to create a fadein background. However I wanted to see if it is possible to make it go away once you open an accordion tab from the menu and appear again once they are all closed. Here is the link to the website so that you have a better idea. WEBSITE
this is the jquery cycle plugin I'm using:
<script type="text/javascript">
$(document).ready(function() {
$('.slideshow').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
});
</script>
and this is THE SLIDE (ACCORDION) SRIPT i'm using:
<script type="text/javascript">
$('a.slidecontrol').click(function(){
$(".display").not($(this开发者_如何转开发).next()).slideUp();
var $this = $(this);
var divID = $this.attr("id").replace("slidecontrol_", "slidedisplay_");
var $div = $('#'+divID);
if ($div.is(':visible')) {
$div.slideUp(500);
} else {
$div.slideDown(500);
}
return false;
});
</script>
Thanks! Sofi
What about adding a $('.slideshow').cycle('pause')
in your click()
?
More details here: http://jquery.malsup.com/cycle/pause.html
Edit based on your comments:
<script type="text/javascript">
var toggleBackground = function() {
if ($('.display:visible').length) {
$('.slideshow').fadeOut().cycle('pause');
} else {
$('.slideshow').fadeIn().cycle('resume');
}
}
$('a.slidecontrol').click(function(){
$(".display").not($(this).next()).slideUp();
var $this = $(this);
var divID = $this.attr("id").replace("slidecontrol_", "slidedisplay_");
var $div = $('#'+divID);
if ($div.is(':visible')) {
$div.slideUp(500, toggleBackground);
} else {
$div.slideDown(500, toggleBackground);
}
return false;
});
</script>
精彩评论