случайный эскиз по умолчанию для блоггера

Question

случайный эскиз по умолчанию для блоггера

0

В настоящее время я изучаю html и css. Я работаю над шаблоном блога блогера.

У моего шаблона есть первая страница миниатюр.

Я установил класс для моего эскиза по умолчанию, когда мои сообщения не имеют изображения, и я установил URL-адрес в css.

.altthumbnails {
   background: url(myimagelocation.jpg);  
}

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

Спасибо за любые ответы

user3532298 14 апр. 2014, в 17:14

Источник

1

с некоторым php или JavaScript
Scott 14 апр. 2014, в 14:27

Теги:

html

css

thumbnails

default

1 ответ

Ещё вопросы

Ryan.Hunt · Answer 1 · 2014-04-14T12-51-00.000Z

Вы не можете сделать это только с чистым css. Но вы можете сделать это либо с помощью кода на стороне сервера, либо с помощью js, который я предлагаю. В основном одно из самых простых решений для этого - вы можете создавать разные классы для каждого изображения, которое вы хотите использовать, тогда вы можете создать случайное число в js и использовать это число для применения различных классов к вашим элементам. Вот пример:

DEMO

В примере есть 5 различных классов css, которые снабжают 5 разных фоновых изображений, и все их имена заканчиваются цифрами 1 >> 5.

.thumb_1 { .. }
.thumb_2 { .. }
.thumb_3 { .. }
.thumb_4 { .. }
.thumb_5 { .. }

В javascript мы будем проходить через объекты, генерировать случайное число 1 >> 5 и использовать этот номер для добавления нового класса, подобного этому.

var div = document.getElementsByClassName("thumb");

//var rand = Math.floor(Math.random() * 5 ); // for just one image

for (var i = 0; i < div.length; i++){
   var rand = Math.floor(Math.random() * 5 ); // for multiple images
   div[i].className += " thumb_" + (rand + 1) ;
};

Спасибо, это действительно интересно. Я пройду через это
Я думаю, что мне может понадобиться значительно расширить мои знания о JS. Я могу видеть принципы этого все же. Еще раз спасибо.