以下はJavaScriptのサンプルです。
----------------------------------------------
<html>
<head>
<title></title>
<script>
<!--
function drawLink(id, len){
var dataAry = [
{img:"sample1.gif", url:"test1.htm", msg:"説明1"},
{img:"sample2.gif", url:"test2.htm", msg:"説明2"},
{img:"sample3.gif", url:"test3.htm", msg:"説明3"},
{img:"sample4.gif", url:"test4.htm", msg:"説明4"},
{img:"sample5.gif", url:"test5.htm", msg:"説明5"},
{img:"sample6.gif", url:"test6.htm", msg:"説明6"},
{img:"sample7.gif", url:"test7.htm", msg:"説明7"},
{img:"sample8.gif", url:"test8.htm", msg:"説明8"}
];
if(len > dataAry.length) len = dataAry.length;
var str = "";
var count = 0;
while(true){
if(count >= len) break;
var dataIndex = Math.floor(Math.random() * dataAry.length);
var data = dataAry[dataIndex];
if(data.flg != null){
continue;
}
str += "<a href='" + data.url + "'><img src='" + data.img + "'/></a><br/>"
+ "<p>" + data.msg + "</p>";
data.flg = true;
count++;
}
document.getElementById(id).innerHTML = str;
}
// -->
</script>
</head>
<body onload="drawLink('link', 4);">
<div id="link"></div>
</body>
</html>
----------------------------------------------
・drawLink関数
・第一引数:表示対象要素
・第二引数:表示画像数
ページのonloadイベントで呼び出してください。
dataAryのメンバを増減する際は「,」の整合性に注意してください。(最後は不要です)
タグ部分も編集すればお望みのものができるかと。
補足
すごい。これを使えばイメージの物が出来るのですね。 一度、挑戦してみたいと思います。 ありがとうございました!!