0

この div 内の画像の属性を JS 配列に追加し、これらの画像を使用して Supersized を実行する必要があります。

       <div id="dgaslides">
            <img src="img/temp/topimg01.jpg" title="Image 1">
            <img src="img/temp/topimg02.jpg" title="Image 2">
            <img src="img/temp/topimg03.jpg" title="Image 3">
        </div>

私のJS：

jQuery(function($){

var img_length = $('#dgaslides img').length-1;

var dgaslides = [];

$('#dgaslides img').each( function(i){

    var src     = $(this).attr('src');
    var title   = $(this).attr('title');

    dgaslides.push("{image : '" + src + "', title : '" + title + "'}");

    if(img_length == i){

        $.supersized({

            // Functionality
            slide_interval          :   3000,       // 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
            horizontal_center       :   1,          // Centers image horizontally. When turned off, the images resize/display from the left of the page.


            // Components                           
            slide_links             :   'blank',    // Individual links for each slide (Options: false, 'num', 'name', 'blank')
            slides                  :   dgaslides

        });

    }
}); });

私の出力に3つの画像が表示されるので、うまくいきますが、リンク（src）は「未定義」で、タイトルもありませんか？

ハードコードする正しい方法は次のとおりです。

var dgaslides = [           // Slideshow Images
                {image : 'img/temp/topimg01.jpg', title : 'Reception'},
                {image : 'img/temp/topimg02.jpg', title : 'Reception 2 og noget mere tekst her'},  
                {image : 'img/temp/topimg03.jpg', title : 'Reception 3'}
            ];

私が間違っていることを理解するのを手伝ってくれる人はいますか?

4

3 に答える 3

0

オブジェクトではなく配列に文字列を保存しています。

これは、意図したとおりに機能するコードの変更されたバージョン (スーパーサイズの関数なし) を含む JSFiddle です: http://jsfiddle.net/SBuXF/

主な変更点:dgaslides.push({image : src, title : title});

生成された配列をコンソールに出力し、その後にハードコードされた配列を出力しました-それらは同一です。

編集:ハードコードされたタイトルが HTML と一致しなかったため、2 つの配列の内容はわずかに異なりますが、どちらも正しくフォーマットされています。修正されたフィドルはこちら: http://jsfiddle.net/SBuXF/1/

于 2013-05-06T02:30:06.423 に答える
0

文字列の配列ではなく、オブジェクトの配列を渡す必要があると思います。

dgaslides.push({image : src, title : title });
于 2013-05-06T02:25:21.310 に答える