PHP.SU

Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Без описания
ZION3312
Отправлено: 25 Января, 2022 - 02:36:04
Post Id


Новичок


Покинул форум
Сообщений всего: 10
Дата рег-ции: Февр. 2021  


Помог: 0 раз(а)




Имеется красивая галерея, но нужна небольшая модернизация.
Когда наводишь курсор меняется картинка, и когда убираешь курсор то остается та картинка на которой убралась мышка.
Задача! Нужно что бы при убирании мышки, возвращалось на первую картинку.
Вот сам скрипт, типа что то допилить надо в js. Но тут я не силен.
https://dimox[dot]name/hover-images-slider-preview/
 
 Top
Vladimir Kheifets
Отправлено: 25 Января, 2022 - 06:38:30
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 833
Дата рег-ции: Март 2017  
Откуда: Германия, Бавария


Помог: 37 раз(а)




ZION3312 пишет:
Имеется красивая галерея, но нужна небольшая модернизация.
Когда наводишь курсор меняется картинка, и когда убираешь курсор то остается та картинка на которой убралась мышка.
Задача! Нужно что бы при убирании мышки, возвращалось на первую картинку.
Вот сам скрипт, типа что то допилить надо в js. Но тут я не силен.
https://dimox.name/hover-images-slider-preview/


Добрый день!
Попробуйте добавить обработчик:
в native JavaScript
CODE (javascript):
скопировать код в буфер обмена
  1. hvrSectors.addEventListener('mouseout', function () {
  2.   setActiveEl(hvrSectors.firstChild);          
  3. });
в jQuery
CODE (javascript):
скопировать код в буфер обмена
  1. hvrSectors.on('mouseout', function () {
  2.   setActiveEl($(hvrSectors.firstChild));        
  3. });
Удачи!
 
 Top
ZION3312
Отправлено: 25 Января, 2022 - 11:04:37
Post Id


Новичок


Покинул форум
Сообщений всего: 10
Дата рег-ции: Февр. 2021  


Помог: 0 раз(а)




Vladimir Kheifets пишет:
ZION3312 пишет:
Имеется красивая галерея, но нужна небольшая модернизация.
Когда наводишь курсор меняется картинка, и когда убираешь курсор то остается та картинка на которой убралась мышка.
Задача! Нужно что бы при убирании мышки, возвращалось на первую картинку.
Вот сам скрипт, типа что то допилить надо в js. Но тут я не силен.
https://dimox.name/hover-images-slider-preview/


Добрый день!
Попробуйте добавить обработчик:
в native JavaScript
CODE (javascript):
скопировать код в буфер обмена
  1. hvrSectors.addEventListener('mouseout', function () {
  2.   setActiveEl(hvrSectors.firstChild);          
  3. });
в jQuery
CODE (javascript):
скопировать код в буфер обмена
  1. hvrSectors.on('mouseout', function () {
  2.   setActiveEl($(hvrSectors.firstChild));        
  3. });
Удачи!


Я в этом не шарю, но знал что параметр "mouseout" ток как дальше... было для меня не понятно. Ты для меня бог кодинга!!! Все работает!!!
 
 Top
ZION3312
Отправлено: 25 Января, 2022 - 13:48:51
Post Id


Новичок


Покинул форум
Сообщений всего: 10
Дата рег-ции: Февр. 2021  


Помог: 0 раз(а)




Vladimir Kheifets
Есть проблемка. В галерее к примеру 9 картинок. И когда только открыл страницу, выводит последнюю картинку.
При наведении и убирании мышки, появляется как надо первая картинка.
Как сделать что бы сразу первая появлялась а не последняя, после полной загрузки страницы.

Вот сам сайт https://cs-exe[dot]ru/ (первые 2 новости тестируются)

(Отредактировано автором: 25 Января, 2022 - 13:49:24)

 
 Top
Vladimir Kheifets
Отправлено: 25 Января, 2022 - 15:24:52
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 833
Дата рег-ции: Март 2017  
Откуда: Германия, Бавария


Помог: 37 раз(а)




ZION3312 пишет:
Vladimir Kheifets
Есть проблемка. В галерее к примеру 9 картинок. И когда только открыл страницу, выводит последнюю картинку.
При наведении и убирании мышки, появляется как надо первая картинка.
Как сделать что бы сразу первая появлялась а не последняя, после полной загрузки страницы.
Вот сам сайт https://cs-exe[dot]ru/ (первые 2 новости тестируются)


Вам нужно добавить обработчик загрузки последней картинки
CODE (javascript):
скопировать код в буфер обмена
  1. lastImgEl = document.querySelectorAll(".images").lastChild;
  2. lastImgEl.addEventListener('load', function () {
  3.   setActiveEl(hvrSectors.firstChild);          
  4. });

(Отредактировано автором: 25 Января, 2022 - 18:34:00)

 
 Top
ZION3312
Отправлено: 26 Января, 2022 - 01:43:20
Post Id


Новичок


Покинул форум
Сообщений всего: 10
Дата рег-ции: Февр. 2021  


Помог: 0 раз(а)




Vladimir Kheifets пишет:
ZION3312 пишет:
Vladimir Kheifets
Есть проблемка. В галерее к примеру 9 картинок. И когда только открыл страницу, выводит последнюю картинку.
При наведении и убирании мышки, появляется как надо первая картинка.
Как сделать что бы сразу первая появлялась а не последняя, после полной загрузки страницы.
Вот сам сайт https://cs-exe[dot]ru/ (первые 2 новости тестируются)


Вам нужно добавить обработчик загрузки последней картинки
CODE (javascript):
скопировать код в буфер обмена
  1. lastImgEl = document.querySelectorAll(".images").lastChild;
  2. lastImgEl.addEventListener('load', function () {
  3.   setActiveEl(hvrSectors.firstChild);          
  4. });


Не помогло. Может както реализовать одновременную загрузку всех изображений?
 
 Top
Vladimir Kheifets
Отправлено: 26 Января, 2022 - 07:05:33
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 833
Дата рег-ции: Март 2017  
Откуда: Германия, Бавария


Помог: 37 раз(а)




ZION3312 пишет:
Vladimir Kheifets пишет:
ZION3312 пишет:
Vladimir Kheifets
Есть проблемка. В галерее к примеру 9 картинок. И когда только открыл страницу, выводит последнюю картинку.
При наведении и убирании мышки, появляется как надо первая картинка.
Как сделать что бы сразу первая появлялась а не последняя, после полной загрузки страницы.
Вот сам сайт https://cs-exe[dot]ru/ (первые 2 новости тестируются)


Вам нужно добавить обработчик загрузки последней картинки
CODE (javascript):
скопировать код в буфер обмена
  1. lastImgEl = document.querySelectorAll(".images").lastChild;
  2. lastImgEl.addEventListener('load', function () {
  3.   setActiveEl(hvrSectors.firstChild);          
  4. });


Не помогло. Может както реализовать одновременную загрузку всех изображений?


Посмотрел страницу. Вы забыли написать, что на ней несколько слайдеров.
Посмотрите фрагмент нтмл кода, который повтряется для каждого слайдера.
CODE (html):
скопировать код в буфер обмена
  1. <div class="images">
  2. <ul class="xfieldimagegallery gallery">
  3. <li>
  4. <a href="https://cs-exe.ru/uploads/posts/2022-01/1643109488_1.jpg" onclick="return hs.expand(this, { slideshowGroup: 'xf_44_gallery' })" target="_blank">
  5. <img src="/uploads/posts/2022-01/thumbs/1643109488_1.jpg" alt="" class="lazy" style="display: block;"></a></li>
  6. <li>
  7. ...
  8. </div>
  9. <div class="hvr__sectors">
  10. <div class="hvr__sector"></div>
  11. <div class="hvr__sector"></div>
  12. <div class="hvr__sector"></div>
  13. ...
  14. </div>
Поэтому не помогло.
К сожалению, у меня нет возможности проверить. Попробуйте так:
CODE (javascript):
скопировать код в буфер обмена
  1. imagesNodeList = document.querySelectorAll(".images");
  2. hvr__sectorsNodeList = document.querySelectorAll(".hvr__sectors");
  3. for (i = 0; i < imagesNodeList.length; i++) {  
  4.   lazyNodeList=imagesNodeList[i].querySelectorAll(".lazy");  
  5.           lazyNodeList.lastChild.EventListener('load', function () {
  6.                  setActiveEl(hvr__sectorsNodeList[i].firstChild);          
  7.           });
  8.   }    
  9. }

(Отредактировано автором: 26 Января, 2022 - 07:09:20)

 
 Top
Страниц (1): [1]
Сейчас эту тему просматривают: 1 (гостей: 1, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
 



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB