お世話になっております。

ページにアクセスするたびにリンク付き画像が自動で配置変更するページを作成したいのですが
javascript、CSSはほとんど触ったことがなく上手くできずにいます。

ネットで調べていろいろやってみましたが上手くできません。
現時点で以下のように入力していますが、どこに何を入れるのかもよくわかりません。
ページを確認すると、画像がエラーになっていて表示されません。

どのように修正したらいいでしょうか。
_____________________________________________________
<img id="at1" src="http://image.rakuten.co.jp/SHOP-URL/cabinet/01550833/imgrc0075385121.jpg" onclick="mejya"><br>
<img id="at2" src="https://image.rakuten.co.jp/SHOP-URL/cabinet/00959373/imgrc0072363734.jpg" onclick="ajimeguri"><br>
<img id="at3" src="https://image.rakuten.co.jp/SHOP-URL/cabinet/03333665/imgrc0074300053.jpg" onclick="shijimi"><br>
<img id="at4" src="https://image.rakuten.co.jp/SHOP-URL/cabinet/02486663/imgrc0073540103.jpg" onclick="misokare-"><br>
<img id="at5" src="https://image.rakuten.co.jp/SHOP-URL/cabinet/02486663/imgrc0072591045.jpg" onclick="neputa"><br>
<img id="at6" src="https://image.rakuten.co.jp/SHOP-URL/cabinet/02486663/img60475381.jpg" onclick="nebuta" width="400"><br>

<script>

var num = [];
for(var i=1; i<=6; i++){
num[i] = i;
}

for(var i=0; i<100; i++){
rand = Math.floor(Math.random()*6) + 1;
numA = num[1];
numB = num[rand];
num[rand] = numA;
num[1] = numB;
}

for(var i=1; i<=6; i++){
document.getElementById("at"+i).src= "sample"+num[i]+".gif";
}

var url = [];
url[1]="http://item.rakuten.co.jp/SHOP-URL/ITEM-URL/";
url[2]="http://item.rakuten.co.jp/SHOP-URL/ITEM-URL/";
url[3]="http://item.rakuten.co.jp/SHOP-URL/ITEM-URL/";
url[4]="http://item.rakuten.co.jp/SHOP-URL/ITEM-URL/";
url[5]="http://item.rakuten.co.jp/SHOP-URL/ITEM-URL/";
url[6]="http://item.rakuten.co.jp/SHOP-URL/ITEM-URL/";

function test(IDnumber){
window.open(url[num[IDnumber]]);
}

</script>