JavaScript с предварительной загрузкой случайно названных изображений из каталога сайта
У меня есть веб-сайт HTML с видео и пользовательскими кнопками управления видео. Когда вы наведите курсор мыши на кнопку воспроизведения / паузы, например, она использует CSS, чтобы изменить другую фотографию кнопки воспроизведения с другим цветом, но если вы перебираете ее впервые после загрузки или перезагрузки страницы, она становится пустой когда вы наводите на него, потому что он должен загрузить изображение, на которое он меняется, при наведении. Я нашел способ предварительно загрузить изображения с числовыми именами, начиная с одного. У меня есть набор миниатюрных изображений, и все они имеют номер + 'mo.png' в качестве имени. Это идет 1mo.png, 2mo.png и так далее. Я использовал этот метод для предварительной загрузки их всех автоматически:
for(var x = 1; x < 5; x++){
no = x.toString();
cs = 'img' + no + ' = new Image(); img' + no + ".src = 'media/" + no + "mo.png';";
eval(cs);
}
Но это работает только для изображений, которые идут от 1mo.png до 4mo.png (4 можно изменить в зависимости от того, сколько картинок с 'mo' в конце их имени я хочу предварительно загрузить).
Я хочу, чтобы JavaScript проходил через папку images в моем каталоге и использовал тот же метод, который я использовал для изображений 'mo', предварительно загружая любые найденные изображения с любым случайным именем. Практически все, что мне нужно знать, это как получить имена файлов из определенной папки в собственной директории моего сайта и сохранить их в массиве или переменных.
1 ответ
Клиентский Javascript в браузере не будет иметь прямого доступа к каталогам вашего сервера. Любой серверный язык, такой как Node, Ruby, Python и PHP, может анализировать ваши файлы и каталоги.
Я бы настроил скрипт на выбранном вами языке, который возвращает содержимое папки как jsonp, чтобы вы могли вызывать его из других доменов без ошибки межсайтового скриптинга. Затем запросите этот сценарий содержимого папки через ajax в Javascript.
ТАК вопрос на ту же тему:
перечислить все изображения в каталоге в формате JSON
Вот еще одна функция PHP, которая поможет.
print_r(scandir('/var/www/yoursite.com/media'));