Случайное изображение заголовка на странице Обновить, CSS jquery javascript? - PullRequest
0 голосов
/ 03 февраля 2011

Мне нужна помощь в поиске кода для моей веб-страницы.У меня есть страница "customize.css", в которой есть код для загрузки изображения заголовка.Но заголовок загружается в «header.asp», который затем загружается на страницу индекса «default.asp».Наверное, мой вопрос в том, что я могу использовать для генерации одного из четырех созданных мной изображений заголовков, случайно на каждой странице, для перезагрузки / обновления заголовка?

Этот код взят из моего "customize.css"файл.После того, как я получу код, что я помещу в «background-image:» для загрузки на страницу?

# header {color: #FFF;высота: 350 пикселей;цвет фона: прозрачный;background-image: ЧТО СДЕЛАТЬ ЗДЕСЬ? ;background-position: слева вверху;повторение фона: без повтора;}

Я искал сетевой форум за форумом в течение прошлой недели в поисках ответа, но пока не получил его.У кого-нибудь есть идеи?Спасибо

Ответы [ 4 ]

1 голос
/ 03 февраля 2011

Я бы пошел просто. Определите 4 разных класса, каждый с разным фоновым изображением. В своем сценарии заголовка ASP выберите один из 4 классов случайным образом и выведите этот класс в свой код. Все просто, изображения будут кэшироваться по мере их отображения, и поскольку вы избегаете JavaScript, это работает для 100% браузеров / пользователей. Для небольшого проекта его легко поддерживать.

Теперь, если вы получите 100 различных фоновых изображений, вы захотите сделать что-то другое.

0 голосов
/ 03 февраля 2011

Единственный способ сделать это в CSS - вызвать URL, который возвращает случайное изображение. Что-то вроде:

#header { color: #FFF; height: 350px; background-color: transparent; background-image: "/loadimage"; background-position: left top; background-repeat: no-repeat; }

Но тогда вы должны закодировать службу в / loadimage, которая возвращает изображение.

Будет гораздо проще изменить изображение при загрузке страницы через javascript. Предполагая, что у вас есть изображения img0.jpg, img1.jpg, img2.jpg и img3.jpg в каталоге images, вы можете сделать: Вы можете сделать:

<body onload="document.body.background = '/images/img'+Math.floor(Math.random()*4)+'.jpg';" />
0 голосов
/ 03 февраля 2011

Если бы это был я, я бы создал отдельный веб-сервис для обслуживания случайных изображений.Я бы использовал PHP, но я предполагаю, что вы можете сделать это в ASP).

#header { 
    background-image: url(/yourWebService.asp);
}

Пусть служба случайным образом выберет одно из изображений и вернет его соответствующим образом.

0 голосов
/ 03 февраля 2011

См. Случайный заголовок изображения этой страницы

Я использую указанный класс для изменения свойства background-position css.

...