したがって、基本的には、スライドショーに要素をロードするために呼び出される配列内の画像リンクと説明を含む配列があります。ただし、ループとして設定されていないため、呼び出すときに効率が悪く、各配列インデックスを手動で入力して、画像をスライドショーに呼び出すために必要なすべてを取得する必要があります。下記参照：
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="css/supersized.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/supersized.shutter.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/colorbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="scripts/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="scripts/jquery.easing.min.js"></script>
<script type="text/javascript" src="scripts/supersized.3.2.7.js"></script>
<script type="text/javascript" src="scripts/supersized.shutter.js"></script>
<script type="text/javascript" src="scripts/jquery.colorbox-min.js"></script>
<script type="text/javascript" src="scripts/jquery.colorbox.parentsetup.js"></script>
<script type="text/javascript">
jQuery(function($){
//image url, image title
var data = [
['images/events/2012/bimmer_cruise/image_01.jpg', ''],
['images/events/2012/bimmer_cruise/image_02.jpg', ''],
['images/events/2012/bimmer_cruise/image_03.jpg', ''],
['images/events/2012/bimmer_cruise/image_04.jpg', '']
];
$.supersized({
// Functionality
slide_interval : 3000, // Length between transitions
transition : 3, // 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 : data[0][0], title : data[0][1],
thumb : data[0][0],
url : 'colorbox_onclick("' + data[0][0] + '");'},
{image : data[1][0], title : data[1][1],
thumb : data[1][0],
url : 'colorbox_onclick("' + data[1][0] + '");'},
{image : data[2][0], title : data[2][1],
thumb : data[2][0],
url : 'colorbox_onclick("' + data[2][0] + '");'},
{image : data[3][0], title : data[3][1],
thumb : data[3][0],
url : 'colorbox_onclick("' + data[3][0] + '");'}
]
});
});
私は代わりに以下のようなことを考えていましたが、それを理解することはできず、私のウェブ担当者も理解できません。無理って言われたけど頑固です笑
for (var i = 0; i < data.length; i++) {
{image : data[i][0], title : data[i][1],
thumb : data[i][0],
url : 'colorbox_onclick("' + data[i][0] + '");'},
}
どんな助け/洞察も大歓迎です:)