Альтернатива JavaScript для вращения по сценарию pageload

Question

У меня есть сайт, на котором я хочу создать галерею с набором изображений размером 16 * 3.

Для Ваха Set я щас скрипт, который случайным образом изменяет изображение при каждой загрузке страницы:

<script type="text/javascript"> 
images = new Array(3); 
images[0] = "<a href='http://www.domain.tld/'><img border='0' src='./images/first.jpg' width='239' height='320' class='kontimg' /></a>"; 
images[1] = "<a href='http://www.domain.tld/'><img border='0' src='./images/second.jpg' width='239' height='320' class='kontimg' /></a>"; 
images[2] = "<a href='http://www.domain.tld/'><img border='0' src='./images/third.jpg' width='239' height='320' class='kontimg' /></a>"; 
index = Math.floor(Math.random() * images.length); 
document.write(images[index]); 
</script> 

В целом довольно простым, но пользователи с JS-инвалидов получают больше, не меньше , поэтому мне нужна другая альтернатива, и это также сильно раздувает код. Представьте, что я использовал этот фрагмент 16 раз на одной странице.

Я попытался найти что-то, что можно было бы сделать с помощью этого jquery-материала, но в основном это слайд-шоу и другие вращающиеся вещи (довольно удивительные вещи), но я не смог найти ни одного кода «на странице, загрузить случайное изображение».

Я даже попробовал уже слайд-шоу, но по какой-то причине он не работает, не перепутав полный css снова. В основном изображения были в ul/li-Tag, но когда я добавил файлы jquery и перехватывал внутри страницы, он никогда не работал.

Есть ли другое решение? Должен ли я просто держать свои раздутые js и добавлять a, где я просто загружаю первых 16 магов и иди с этим?

Было бы очень рад, если бы кто-то мог одолжить мне руку здесь.

Сердечные приветы Sascha

Answer 1

Там нет никакого способа сделать это без JavaScript. Если вы просто хотите, чтобы избежать повторения немного, предполагая, что вы используете JQuery вы могли бы сделать что-то вроде этого:

var imageNames = ['first', 'second', 'third']; 
var image = imageNames[getRandomInt(0, imageNames.length - 1)] 

$("body").append("<a href='http://www.domain.tld/'><img border='0' src='./images/"+image+".jpg' width='239' height='320' class='kontimg' /></a>"); 

function getRandomInt(min, max) { 
    return Math.floor(Math.random() * (max - min + 1)) + min; 
}