單幻燈片幻燈片中的多個數組元素？

我已經從一個數組中的圖像做了一個簡單的幻燈片。除了圖像之外，我還尋找一種方法爲每張「幻燈片」添加元素，但它們只涉及圖像屬性（標題，alt，url等）。有沒有一種方法可以添加到每個幻燈片的數組中創建類（除圖像以外的元素，如標題文本和內容段落）在我的JavaScript中（並在CSS中風格化）？單幻燈片幻燈片中的多個數組元素？

這是我當前的代碼：

var infoData =[ 
    'images/image1.jpg', 
    'images/image2.jpg', 
    'images/image3.jpg', 
    'images/image4.jpg', 
    'images/image5.jpg', 
]; 

var cnt = infoData.length; 

$(function() { 
    setInterval (Slider, 3000); 
}); 

function Slider() { 
    $('.infoFader').fadeOut('slow', function() { 
     $(this).attr('src', infoData[(infoData.length++) % cnt]).fadeIn('slow'); 
    }); 
}

眼下，數據在我的HTML

<img class="infoFader" src="" />

通過圖像標籤拉我想數組是這樣的：

{ 
    'category':"category title", 
    'linkurl':"http://www.billiards.com", 
    'image':"images/image1.jpg", 
    'title':"These are people playing pool", 
    'subtitle':"a little more information here", 
    'more':[ 
     {'title':"How to play billiards",'url':"http://www.billiards.com"}, 
     {'title':"Best pool angles",'url':"http://www.poolangles.com"}, 
     {'title':"Local pool halls and how to avoid them",'url':"http://www.avoidpoolhalls.com"}, 
     {'title':"Pool hall of fame",'url':"http://www.halloffame.com"} 
    ] 
}, 

{ 
    'category':"category title", 
    'linkurl':"http://www.playingtennis.com", 
    'image':"images/image2.jpg", 
    'title':"This little boy is playing tennis", 
    'subtitle':"more info on tennis here", 
    'more':[ 
     {'title':"associated link", 'url':"http://www.assoc.com"}, 
     {'title':"item of interest", 'url':"http://www.interesting.com"}, 
    ] 
},

從本質上講，每張幻燈片都有多個可以設計風格的元素（位置，顏色等），基於他們的類，所以HTML將...

<div class="infoFader"></div>

...幷包含一切，而不僅僅是圖像。我是新來的，我已經看到它在另一個幻燈片中完成了，但我不明白JS會刪除所有我不需要的外來東西，並根據我所做的定製它。謝謝你的幫助。

來源

2011-06-23 farsider

你在這裏死你自己。由於您已經在使用jQuery，請使用jQuery.Cycle之類的東西。你指定容器，並且它循環每個第一級別的孩子。這些孩子可以容納任何你想要的;週期不關心。

來源

2011-06-23 17:07:16

單幻燈片幻燈片中的多個數組元素？

回答

相關問題