Случайное отображение изображений — очень широко используемый метод. Например, отображаются случайные баннеры. Когда вы заходите на сайт, его баннер всегда разный или всегда есть подсказки с разным содержанием. Такие примеры вы часто встретите при просмотре Интернета. Используя эту технологию, можно не только разместить больше контента в определенном пространстве, но и создать у людей иллюзию частых обновлений.
Насколько вы взволнованы? На самом деле, если у вас есть немного базовых знаний html и javascript, все очень просто. следуйте за мной и давайте посмотрим на ее случайные секреты.
Начнем с простого примера. Обычно мы добавляем изображения на страницу с помощью <img src="picture">. Если мы хотим отображать три разных изображения случайным образом, нам нужно внести небольшую модификацию в этот код. Сначала добавьте тег <script>:
Ниже приведен фрагмент в кавычках:
<script Language=JavaScript></script>
Затем поместите <img src="picture"> в этот тег, используя document.write(""), и он станет
document.write("<img src=image>")
Теперь давайте закончим самый важный абзац:
Вот цитата:
id=Math.round(Math.random()*2)+1
Таким образом, случайные числа получаются как 1, 2 и 3. Переименуйте изображение, которое хотите отобразить, в 1.gif, 2.gif, 3.gif, ок! Окончательный код:
Вот фрагмент цитаты:
<язык сценария=javascript>
id=Math.round(Math.random()*2)+1
document.write("<img src="+id+".gif>")
</скрипт>
Попробуйте, разве это не хорошо? А что, если каждая моя картинка соответствует гиперссылке?
Предположим, что есть 3 изображения: 1.gif, 2.gif, 3.gif и соответствующие ссылки — url1, url2 и url3.
Чтобы иметь взаимно однозначное соответствие между изображениями и ссылками, нам нужно настроить массив изображений для размещения адреса ссылки следующим образом:
Ниже приведен ссылочный фрагмент:
вар изображение = новый массив (3)
изображение.длина=3
изображение[1]="url1"
изображение[2]="URL2"
изображение[3]="url3"
Чтобы получить ссылку, соответствующую изображению, нам также необходимо определить массив imageurl=image[id]
Принцип таков:
Когда страница читается, берется случайное число, предполагая, что оно равно 2, то есть id=2, тогда мы можем легко отобразить 2.gif на странице, как указано выше. Затем мы видим: imageurl=image[2] и image[2]="url2", остальное легко. Полный код выглядит следующим образом:
Ниже приведен фрагмент в кавычках:
<язык сценария=javascript>
вар изображение = новый массив (3)
изображение.длина=3
изображение[1]="url1"
изображение[2]="url2"
изображение[3]="url3"
id=Math.round(Math.random()*2)+1
imageurl=изображение[id]
document.write("<a href="+bannerurl+">"+"<img src="+id+".gif>")
</скрипт>
Перепечатано из: Seven Color Bird Design --- pc-king