<script type="text/javascript">
jQuery(function ($) {
$.supersized({
// Functionality
slide_interval: 5000, // Length between transitions
transition: 1, // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
transition_speed: 700, // Speed of transition
// Components
slide_links: 'blank', // Individual links for each slide (Options: false, 'num', 'name', 'blank')
slides: [ // Slideshow Images
{ image: 'http://farm9.staticflickr.com/8080/8339311971_cb6706842b_h.jpg', title: 'Image Credit: Maria Kazvan', thumb: 'http://farm9.staticflickr.com/8080/8339311971_cb6706842b_h.jpg', url: 'http://farm9.staticflickr.com/8080/8339311971_cb6706842b_h.jpg' },
{ image: 'http://farm9.staticflickr.com/8345/8208481483_fc6b1bdf7d_h.jpg', title: 'Image Credit: Maria Kazvan', thumb: 'http://farm9.staticflickr.com/8345/8208481483_fc6b1bdf7d_h.jpg', url: 'http://farm9.staticflickr.com/8345/8208481483_fc6b1bdf7d_h.jpg' },
{ image: 'http://farm8.staticflickr.com/7055/6866255833_cf22b71843_b.jpg', title: 'Image Credit: Maria Kazvan', thumb: 'http://farm8.staticflickr.com/7055/6866255833_cf22b71843_b.jpg', url: 'http://farm8.staticflickr.com/7055/6866255833_cf22b71843_b.jpg' },
{ image: 'http://farm9.staticflickr.com/8487/8185988415_62ca8175e9_h.jpg', title: 'Image Credit: Colin Wojno', thumb: 'http://farm9.staticflickr.com/8487/8185988415_62ca8175e9_h.jpg', url: 'http://farm9.staticflickr.com/8487/8185988415_62ca8175e9_h.jpg' },
{ image: 'http://farm9.staticflickr.com/8079/8340357550_397f7e09e3_h.jpg', title: 'Image Credit: Colin Wojno', thumb: 'http://farm9.staticflickr.com/8079/8340357550_397f7e09e3_h.jpg', url: 'http://farm9.staticflickr.com/8079/8340357550_397f7e09e3_h.jpg' },
{ image: 'http://farm9.staticflickr.com/8490/8187033496_cf9587943c_h.jpg', title: 'Image Credit: Colin Wojno', thumb: 'http://farm9.staticflickr.com/8490/8187033496_cf9587943c_h.jpg', url: 'http://farm9.staticflickr.com/8490/8187033496_cf9587943c_h.jpg' },
{ image: 'http://farm7.staticflickr.com/6002/5923622568_46d8e065cc_b.jpg', title: 'Image Credit: Brooke Shaden', thumb: 'http://farm7.staticflickr.com/6002/5923622568_46d8e065cc_b.jpg', url: 'http://farm7.staticflickr.com/6002/5923622568_46d8e065cc_b.jpg' },
{ image: 'http://farm9.staticflickr.com/8502/8339293377_a1574a28be_h.jpg', title: 'Image Credit: Brooke Shaden', thumb: 'http://farm9.staticflickr.com/8502/8339293377_a1574a28be_h.jpg', url: 'http://farm9.staticflickr.com/8502/8339293377_a1574a28be_h.jpg' },
{ image: 'http://farm9.staticflickr.com/8497/8339319687_629c824dc1_h.jpg', title: 'Image Credit: Brooke Shaden', thumb: 'http://farm9.staticflickr.com/8497/8339319687_629c824dc1_h.jpg', url: 'http://farm9.staticflickr.com/8497/8339319687_629c824dc1_h.jpg' }
]
});
});
</script>
<script>
$(document).ready(function () {
function loop(){
$("#p1").delay("1000").fadeIn("slow");
$("#p2").delay("1000").fadeIn("slow");
$("#p1").delay("3000").fadeOut("slow");
$("#p2").delay("3000").fadeOut("slow");
$("#p3").delay("6000").fadeIn("slow");
$("#p3").delay("3000").fadeOut("slow");
$("#p4").delay("12000").fadeIn("slow");
$("#p4").delay("3000").fadeOut("slow");
$("#p5").delay("18000").fadeIn("slow");
$("#p5").delay("3000").fadeOut("slow");
$("#p6").delay("24000").fadeIn("slow");
$("#p6").delay("3000").fadeOut("slow");
$("#p7").delay("30000").fadeIn("slow");
$("#p7").delay("3000").fadeOut("slow");
$("#p8").delay("35000").fadeIn("slow");
$("#p8").delay("3000").fadeOut("slow");
$("#p9").delay("41000").fadeIn("slow");
$("#p9").delay("3000").fadeOut("slow");
$("#p10").delay("46000").fadeIn("slow");
$("#p10").delay("4084").fadeOut("slow",loop);
}
loop();
});
</script>
わかりました、ここに問題があります。画面に表示されるテキストと同期させたい完全な背景スライドショーがあります。ご覧のとおり、このテキストは「p」fadeIns によって表されます。私の問題は、テキストが常に正しい背景スライドに表示されるようにするための現在の方法は、最後の画像を遅らせることです。これは同期が取れなくなるため、理想的とは言えません。これを行うためのより良い方法を誰かに教えていただければ幸いです:DI は、最初の背景画像が画面に表示されるとすぐにフェードイン機能をアクティブにするように指示できると考えていましたが、これを行う方法が不明です.