Hallo,
hier mein script.
Habe hier drei Timouts generiert: "timeout1" "timeout2" "timeout3"
Wie kann ich all diese durch den klick auf z.B.: "#start1_btn_1" stoppen.
Bisher funktionier nur ein "clearTimeout(timeout1);".
Danke schon mal für die Hilfe.
hier mein script.
Code:
$(document).ready(function() {
/** LINK_1 ***********************************************************************************/
$('#start1_btn_1').click(function(){
$('[id^="start1"], [id^="start2"], [id^="start3"]').stop(true).hide();
$('[id^="sitemap"], [class^="infopic"]').fadeOut(500);
$('#back_btn, #rose_first_a, #rose_second_b, #rose_third_b, #rose_fourth_b, #rose_fifth_b, #rose_sixth_b, #rose_seventh_b, #rose_note').fadeIn(1000);
$('#rose_second_a, #rose_third_a, #rose_fourth_a, #rose_fifth_a, #rose_sixth_a, #rose_seventh_a, #rose_first_b').hide();
clearTimeout(timeout1);
})
$('#rose_first_b').click(function(){
$('#rose_first_a, #rose_second_b, #rose_third_b, #rose_fourth_b, #rose_fifth_b, #rose_sixth_b, #rose_seventh_b, #rose_note').fadeIn(1000);
$('#rose_second_a, #rose_third_a, #rose_fourth_a, #rose_fifth_a, #rose_sixth_a, #rose_seventh_a, #rose_first_b').hide();
})
$('#rose_second_b').click(function(){
$('#rose_second_a, #rose_first_b, #rose_third_b, #rose_fourth_b, #rose_fifth_b, #rose_sixth_b, #rose_seventh_b, #rose_note').fadeIn(1000);
$('#rose_first_a, #rose_third_a, #rose_fourth_a, #rose_fifth_a, #rose_sixth_a, #rose_seventh_a, #rose_second_b').hide();
})
$('#rose_third_b').click(function(){
$('#rose_third_a, #rose_first_b, #rose_second_b, #rose_fourth_b, #rose_fifth_b, #rose_sixth_b, #rose_seventh_b,#rose_note').fadeIn(1000);
$('#rose_first_a, #rose_second_a, #rose_fourth_a, #rose_fifth_a, #rose_sixth_a, #rose_seventh_a, #rose_third_b').hide();
})
$('#rose_fourth_b').click(function(){
$('#rose_fourth_a, #rose_first_b, #rose_second_b, #rose_third_b, #rose_fifth_b, #rose_sixth_b, #rose_seventh_b, #rose_note').fadeIn(1000);
$('#rose_first_a, #rose_second_a, #rose_third_a, #rose_fifth_a, #rose_sixth_a, #rose_seventh_a, #rose_fourth_b').hide();
})
$('#rose_fifth_b').click(function(){
$('#rose_fifth_a, #rose_first_b, #rose_second_b, #rose_third_b, #rose_fourth_b, #rose_sixth_b, #rose_seventh_b, #rose_note').fadeIn(1000);
$('#rose_first_a, #rose_second_a, #rose_third_a, #rose_fourth_a, #rose_sixth_a, #rose_seventh_a, #rose_fifth_b').hide();
})
$('#rose_sixth_b').click(function(){
$('#rose_sixth_a, #rose_first_b, #rose_second_b, #rose_third_b, #rose_fourth_b, #rose_fifth_b, #rose_seventh_b, #rose_note').fadeIn(1000);
$('#rose_first_a, #rose_second_a, #rose_third_a, #rose_fourth_a, #rose_fifth_a, #rose_seventh_a, #rose_sixth_b').hide();
})
$('#rose_seventh_b').click(function(){
$('#rose_seventh_a, #rose_first_b, #rose_second_b, #rose_third_b, #rose_fourth_b, #rose_fifth_b, #rose_sixth_b, #rose_note').fadeIn(1000);
$('#rose_first_a, #rose_second_a, #rose_third_a, #rose_fourth_a, #rose_fifth_a, #rose_sixth_a, #rose_seventh_b').hide();
})
});
/** ANIMATION ***********************************************************************************/
function moveAnimated1() {
$('#sitemap_btn_1').addClass('active');
$('#sitemap_btn_2, #sitemap_btn_3').removeClass('active');
$('#start1_note').fadeIn(700);
$('#start1_btn_4').delay(700).fadeIn(1000);
$('#start1_btn_9, #start1_btn_12').delay(1600).fadeIn(1000);
$('#start1_btn_10').delay(2300).fadeIn(1000);
$('#start1_btn_3, #start1_btn_5, #start1_btn_11').delay(3000).fadeIn(1000);
$('#start1_btn_6').delay(3700).fadeIn(1000);
$('#start1_btn_2').delay(4200).fadeIn(1000);
$('#start1_btn_1, #start1_btn_7').delay(5000).fadeIn(1000);
$('#start1_btn_13, #start1_btn_14').delay(5900).fadeIn(1000);
$('#start1_btn_8, #start1_btn_15').delay(6300).fadeIn(1000);
$('#start1_btn_16').delay(6700).fadeIn(1000);
$('[id^="start2"], [id^="start3"]').stop(true).hide();
timeout1 = setTimeout('moveAnimated2()', 16000);
}
function moveAnimated2() {
$('#sitemap_btn_2').addClass('active');
$('#sitemap_btn_1, #sitemap_btn_3').removeClass('active');
$('#start2_note').fadeIn(700);
$('#start2_btn_14').delay(700).fadeIn(1000);
$('#start2_btn_12, #start2_btn_13, #start2_btn_16').delay(1600).fadeIn(1000);
$('#start2_btn_7, #start2_btn_10').delay(2300).fadeIn(1000);
$('#start2_btn_4, #start2_btn_15').delay(3000).fadeIn(1000);
$('#start2_btn_3').delay(3700).fadeIn(1000);
$('#start2_btn_6, #start2_btn_9, #start2_btn_11').delay(4200).fadeIn(1000);
$('#start2_btn_1').delay(5000).fadeIn(1000);
$('#start2_btn_2').delay(5900).fadeIn(1000);
$('#start2_btn_5').delay(6300).fadeIn(1000);
$('#start2_btn_8').delay(6700).fadeIn(1000);
$('[id^="start1"], [id^="start3"]').stop(true).hide();
timeout2 = setTimeout('moveAnimated3()', 16000);
}
function moveAnimated3() {
$('#sitemap_btn_3').addClass('active');
$('#sitemap_btn_1, #sitemap_btn_2').removeClass('active');
$('#start3_note').fadeIn(700);
$('#start3_btn_9').delay(700).fadeIn(1000);
$('#start3_btn_1, #start3_btn_4, #start3_btn_15').delay(1600).fadeIn(1000);
$('#start3_btn_3, #start3_btn_16').delay(2300).fadeIn(1000);
$('#start3_btn_2').delay(3000).fadeIn(1000);
$('#start3_btn_7, #start3_btn_13').delay(3700).fadeIn(1000);
$('#start3_btn_5, #start3_btn_14').delay(4200).fadeIn(1000);
$('#start3_btn_6').delay(5000).fadeIn(1000);
$('#start3_btn_12').delay(5900).fadeIn(1000);
$('#start3_btn_11').delay(6300).fadeIn(1000);
$('#start3_btn_8, #start3_btn_10').delay(6700).fadeIn(1000);
$('[id^="start1"], [id^="start2"]').stop(true).hide();
timeout3 = setTimeout('moveAnimated1()', 16000);
}Habe hier drei Timouts generiert: "timeout1" "timeout2" "timeout3"
Wie kann ich all diese durch den klick auf z.B.: "#start1_btn_1" stoppen.
Bisher funktionier nur ein "clearTimeout(timeout1);".
Danke schon mal für die Hilfe.
