Форум программистов, компьютерный форум, киберфорум
JavaScript для начинающих
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.91/34: Рейтинг темы: голосов - 34, средняя оценка - 4.91
0 / 0 / 0
Регистрация: 01.08.2019
Сообщений: 3

скрипт для создания галереи изображений

01.08.2019, 16:08. Показов 7054. Ответов 1
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
В index.html есть
HTML5
1
<ul class="list"></ul>
В app.js есть масив картинок galleryItems.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
const galleryItems = [
  {
    url:
      'https://images.pexels.com/photos/140134/pexels-photo-140134.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260',
    alt: 'White and Black Long Fur Cat',
  },
  {
    url:
      'https://images.pexels.com/photos/213399/pexels-photo-213399.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260',
    alt: 'Orange and White Koi Fish Near Yellow Koi Fish',
}
]
/*
Нужен скрипт для создания галлереи изображений.

- Использовать массив объектов для создания тегов img вложенных в li.
- Оформление по вкусу, можно и не делать, достаточно чтобы каждое
изображение было 300px по ширине.
- Добавьте все элементы галлереи в ul.gallery.
*/
0
Лучшие ответы (1)
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
01.08.2019, 16:08
Ответы с готовыми решениями:

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

Нужен скрипт для сжатия изображений
на странице есть дивы, в которых изображения прописаны через img, но размеры этих изображений достаточно большие, поэтому при запуске сайта...

Как сделать открытие галереи изображений при клике на картинку
Good day! ;) Делаю Landing page на котором будут представлены несколько квартир. На сайте несколько блоков: Адрес квартиры и одна...

1
Эксперт JS
2037 / 1096 / 409
Регистрация: 29.04.2016
Сообщений: 2,625
01.08.2019, 16:25
Лучший ответ Сообщение было отмечено Egor363 как решение

Решение

Egor363,

https://codepen.io/Mr_Sergo/pen/xvroNV
HTML5
1
<ul class="list"></ul>
JavaScript
1
2
3
4
5
6
7
8
9
10
11
const galleryItems = [
    {
        url: 'https://images.pexels.com/photos/140134/pexels-photo-140134.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260',
        alt: 'White and Black Long Fur Cat',
    },
    {
        url: 'https://images.pexels.com/photos/213399/pexels-photo-213399.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260',
        alt: 'Orange and White Koi Fish Near Yellow Koi Fish',
    }
]
for(let el of galleryItems) document.querySelector('.list').insertAdjacentHTML('beforeEnd', `<li><img src="${el.url}" alt="${el.alt}"></li>`);
CSS
1
2
3
img {
    width: 300px;
}
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
01.08.2019, 16:25
Помогаю со студенческими работами здесь

Нужно исправить скрипт галереи
Коллеги программисты, помогите решить задачку. Мне нужно сделать галерею типа рисунка (смотрите вложенный файл). Переискал кучу скриптов...

Скрипт для создания online web-камеры
Народ у кого нить есть скрипт для создания online web-камеры???

НУЖЕН СКРИПТ для создания голосований на сайте!
Здравствуйте! Для нашего сайта необходим скрипт или что-то подобное (я в этом не сильна), для создания голосований на сайте в виде...

Скрипт для создания чата консультанта на сайт
Кто может знает скрипт для создания чата консультанта на сайт? Хранить данные можно как-угодно, в том числе и SQL базы данных

Скрипт смены изображений
Нашел скрипт смены изображений, но он все фотки отображает в одном размере. Подскажите какие еще бывают скрипты смены фото?


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
Вывод данных через динамический список в справочнике
Maks 01.04.2026
Реализация из решения ниже выполнена на примере нетипового справочника "Спецтехника" разработанного в конфигурации КА2. Задача: вывести данные из ТЧ нетипового документа. . .
Функция заполнения текстового поля в реквизите формы документа
Maks 01.04.2026
Алгоритм из решения ниже реализован на нетиповом документе "ВыдачаОборудованияНаСпецтехнику" разработанного в конфигурации КА2, в дополнении к предыдущему решению. На форме документа создается. . .
К слову об оптимизации
kumehtar 01.04.2026
Вспоминаю начало 2000-х, университет, когда я писал на Delphi. Тогда среди программистов на форумах активно обсуждали аккуратную работу с памятью: нужно было следить за переменными, вовремя. . .
Идея фильтра интернета (сервер = слой+фильтр).
Hrethgir 31.03.2026
Суть идеи заключается в том, чтобы запустить свой сервер, о чём я если честно мечтал давно и давно приобрёл книгу как это сделать. Но не было причин его запускать. Очумелые учёные напечатали на. . .
Модель здравосоХранения 6. ESG-повестка и устойчивое развитие; углублённый анализ кадрового бренда
anaschu 31.03.2026
В прикрепленном документе раздумья о том, как можно поменять модель в будущем
10 пpимет, которые всегда сбываются
Maks 31.03.2026
1. Чтобы, наконец, пришла маршрутка, надо закурить. Если сигарета последняя, маршрутка придет еще до второй затяжки даже вопреки расписанию. 2. Нaдоели зима и снег? Не надо переезжать. Достаточно. . .
Перемещение выделенных строк ТЧ из одного документа в другой
Maks 31.03.2026
Реализация из решения ниже выполнена на примере нетипового документа "ВыдачаОборудованияНаСпецтехнику" с единственной табличной частью "ОборудованиеИКомплектующие" разработанного в конфигурации КА2. . . .
Functional First Web Framework Suave
DevAlt 30.03.2026
Sauve. IO Апнулись до NET10. Из зависимостей один пакет, работает одинаково хорошо как в режиме проекта так и в интерактивном режиме. из сложностей - чисто функциональный подход. Решил. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru