0
    <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 は、最初の背景画像が画面に表示されるとすぐにフェードイン機能をアクティブにするように指示できると考えていましたが、これを行う方法が不明です.

4

1 に答える 1

0

理想的には、テーマの関数theme.beforeAnimation()内にテキストをフェードするコードを配置する必要があります。デフォルトのテーマ (シャッター) を使用している場合は、ファイル supersized.shutter.js を確認し、「beforeAnimation : function(direction){」を検索します。 .

別の(醜い)方法は次のとおりです。

編集: 最初に、縮小されていないテンプレート バージョンを使用していることを確認してください。

<script type="text/javascript" src="theme/supersized.shutter.min.js"></script>

と置換する:

<script type="text/javascript" src="theme/supersized.shutter.js"></script>

次に、supersized.shutter.js ファイルを編集し、 beforeAnimation() 関数内に次の行を追加します (239 行目)

$('[id^="p"]').fadeOut(); 
$('#p' + (vars.current_slide + 1)).delay(500).fadeIn("slow"); 

あなたのhtmlがどうなっているのか分からないので、'p'で始まるidの要素を全て非表示にしています、このセレクターを改善した方が良いでしょう. それだ。

それが役に立てば幸い。

于 2013-02-01T18:17:02.247 に答える