- Поисковые системы
- Практика оптимизации
- Трафик для сайтов
- Монетизация сайтов
- Сайтостроение
- Социальный Маркетинг
- Общение профессионалов
- Биржа и продажа
- Финансовые объявления
- Работа на постоянной основе
- Сайты - покупка, продажа
- Соцсети: страницы, группы, приложения
- Сайты без доменов
- Трафик, тизерная и баннерная реклама
- Продажа, оценка, регистрация доменов
- Ссылки - обмен, покупка, продажа
- Программы и скрипты
- Размещение статей
- Инфопродукты
- Прочие цифровые товары
- Работа и услуги для вебмастера
- Оптимизация, продвижение и аудит
- Ведение рекламных кампаний
- Услуги в области SMM
- Программирование
- Администрирование серверов и сайтов
- Прокси, ВПН, анонимайзеры, IP
- Платное обучение, вебинары
- Регистрация в каталогах
- Копирайтинг, переводы
- Дизайн
- Usability: консультации и аудит
- Изготовление сайтов
- Наполнение сайтов
- Прочие услуги
- Не про работу
В 2023 году 36,9% всех DDoS-атак пришлось на сферу финансов
А 24,9% – на сегмент электронной коммерции
Оксана Мамчуева
Зачем быть уникальным в мире, где все можно скопировать
Почему так важна уникальность текста и как она влияет на SEO
Ingate Organic
Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий
Есть шаблон от w3layouts. https://p.w3layouts.com/demos/photo_cart/web/
Там прикольно реализовали превью с js. Вот кусок html, это я как понял задают data для js.
а вот сам js - https://p.w3layouts.com/demos/photo_cart/web/js/grid.js
Меня интересует вот этот кусок
Preview.prototype = {create : function() {
// create Preview structure:
this.$title = $( '<h3> </h3>' );
this.$description = $( '<p></p>' );
this.$href = $( '<p class="read-more"><a href="details.html">Read More</a></p>' );
this.$details = $( '<div class="og-details"></div>' ).append( this.$title, this.$description, this.$href );
this.$loading = $( '<div class="og-loading"></div>' );
this.$fullimage = $( '<div class="og-fullimg"></div>' ).append( this.$loading );
this.$closePreview = $( '<span class="og-close"></span>' );
this.$previewInner = $( '<div class="og-expander-inner"></div>' ).append( this.$closePreview, this.$fullimage, this.$details );
this.$previewEl = $( '<div class="og-expander"></div>' ).append( this.$previewInner );
// append preview element to the item
this.$item.append( this.getEl() );
// set the transitions for the preview and the item
if( support ) {
this.setTransition();
}
Как в строке this.$href = $( '<p class="read-more"><a href="details.html">Read More</a></p>' ); Задать вместо ссылки details.html ссылку на полноразмерную картинку?
Берете ссылку из data-largesrc (как я понимаю, $fullimage) и вставляете куда нужно.
Там же вроде все просто. У картинки указаны data- параметры и на основе них формируется открывающийся блок. Можно не разбираться с их кодом, а быстрее свой написать. :)