Изменить фоновое изображение при обновлении страницы

Question

Изменить фоновое изображение при обновлении страницы

0

В настоящее время у меня есть php, который меняет фоновое изображение div каждый раз, когда страница обновляется.

В голове моего HTML у меня есть это

<?php 
$bg = rand(1, 6); 
$bgchange = $bg.".jpg"; 
?>

и затем это

<style type="text/css">
.cover {
  background-image: url('../img/backgrounds/<?php echo $bgchange; ?>');
}
</style>

Поскольку вы можете видеть, что это очень простой бит php, он выполняет эту работу, но у меня возникают проблемы, когда сайт сначала загружается на компьютер или если интернет медленный, когда изображение не загружается.

Любые javascript-ребята, которые могут порекомендовать решение для этого, я бы очень признателен, я также думаю, что javascript будет лучше, поскольку изображение может "исчезнуть" и т.д. Я ссылаюсь на jquery-1.10.2 в своем проекте.

PS Решение не обязательно должно быть javascript, если кто-то знает, как улучшить мой PHP-код или может предложить причину, по которой код иногда не срабатывает, что было бы действительно полезно.

user2078845 10 нояб. 2013, в 12:52

Источник

Теги:

php

javascript

jquery

html

css

2 ответа

Ещё вопросы

Kevin Lynch · Answer 1 · 2013-11-10T10-11-00.000Z

Сначала создайте массив изображений:

var images = ['image1.jpg', 'image2.jpg', 'image3.jpg', 'image4.jpg', 'image5.jpg'];

Затем установите случайное изображение в качестве фонового изображения:

 $('body').css({'background-image': 'url(images/' + images[Math.floor(Math.random() *      images.length)] + ')'});

Это не должно вызывать проблем.

Idan Magled · Answer 2 · 2013-11-10T09-19-00.000Z

вы можете делать (и должны) делать это действие в js.

в функции загрузки документа вы можете это сделать. // функция загрузки документа

$(function(){

    var bgImage = (Math.floor(Math.random() * 6))+ ".jpg;"
    $('.cover').css('background-image',"../img/backgrounds/"+bgImage);
});

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

Я удалил свой текущий код .php и попытался включить этот код между двумя тегами скрипта в заголовке моего HTML, по какой-то причине не сработал, я получил неожиданную ошибку токена в консоли.
Я не понимаю, почему это не должно работать, хм ...
<script src = " code.jquery.com/jquery-1.10.1.min.js" ></script> <script src =" code.jquery.com/jquery-migrate-1.2.1.min.js "> </… >
Скопируйте и вставьте две строчки кода в вашу головную метку, и все будет хорошо.
<script src = "// ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </ script> <script> window.jQuery || document.write ('<script src = "js / vendor / jquery-1.10.2.min.js"> <\ / script>') </ script>
Вот как я подаю jQuery на мою страницу ...