Перейти к содержанию
Bersi

Нужна помощь в JavaScript (модуль Cloud Zoom Free)

Рекомендуемые сообщения

Переделываю под себя модуль Cloud Zoom Free (oc 1.5.3). Немного поменял стиль вывода и добавил пару условий на вывод картинки, меньше заданного в параметрах зума. Кроме того, картинки у меня не квадратные, а масштабируются исходя из пропорций исходного изображения.

Заметил глюк: в некоторых случаях (от чего зависит, так и не понял) скрипт не может определить background-position для линзы. Как это происходит, можно посмотреть по ссылке (третья картинка в списке) и на скриншотах (прилагаются).

Не правильно:

Изображение

Правильно:

Изображение

Вроде бы нашел код в скрипте, который за это отвечает (cloud-zoom.1.0.2.js, строки 131-135):

				lens.css({
					left: x,
					top: y
				});
				lens.css('background-position', (-x) + 'px ' + (-y) + 'px');
При этом значения left и top определяются прекрасно, проблема именно с background-position.

Очень прошу помощи профессионалов.

Во вложении модифицированный модуль.

ЗЫ: я не программер, потому прошу строго не судить, если что-то объяснил коряво :)

cloud-zoom-magnifier-simple 1531-mod.zip

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Разобрался сам.

Округлил значения до целых, поменяв

				var x = (mx - sImg.offset().left - (cw * 0.5)) >> 0;
				var y = (my - sImg.offset().top - (ch * 0.5)) >> 0;
			  
				if (x < 0) {
					x = 0;
				}
				else if (x > (sImg.outerWidth() - cw)) {
					x = (sImg.outerWidth() - cw);
				}
				if (y < 0) {
					y = 0;
				}
				else if (y > (sImg.outerHeight() - ch)) {
					y = (sImg.outerHeight() - ch);
				}
на:

				var x = Math.round(mx - sImg.offset().left - (cw * 0.5)) >> 0;
				var y = Math.round(my - sImg.offset().top - (ch * 0.5)) >> 0;
			  
				if (x < 0) {
					x = 0;
				}
				else if (x > (sImg.outerWidth() - cw)) {
					x = Math.round(sImg.outerWidth() - cw);
				}
				if (y < 0) {
					y = 0;
				}
				else if (y > (sImg.outerHeight() - ch)) {
					y = Math.round(sImg.outerHeight() - ch);
				}
Тему можно удалять :)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Молодец!

Зачем же удалять, если нашел решение, да еще и описал его, еще может пригодиться кому либо! :wink:

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Скачал файл что то не работает, там нужно все менять как выше описано? (есть готовый рабочий?)

И еще по поводу qmoda я что то не разберусь когда устанавливаешь подобные модули  как их потом настраивать или отключат в qmode а то в модулях не отображает не как понять не могу

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Скачал файл что то не работает, там нужно все менять как выше описано? (есть готовый рабочий?)

И еще по поводу qmoda я что то не разберусь когда устанавливаешь подобные модули  как их потом настраивать или отключат в qmode а то в модулях не отображает не как понять не могу

vqmod создает папку xml в своей директории, там и лежат собственно файлы, изменяющие стандартный функционал. Если переименовать расширение подобного файла (например, mod.xml0 вместо mod.xml), это приведет к "отключению" мода. Ну или можно просто удалить ненужный файл. Что же касается изменений, где-то была неплохая инструкция (пришлю в личке).

 

Также пришлю готовый файл вместе с vqmod'ом в ближайшее время (сейчас он не под рукой).

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Скачал файл что то не работает, там нужно все менять как выше описано? (есть готовый рабочий?)

И еще по поводу qmoda я что то не разберусь когда устанавливаешь подобные модули  как их потом настраивать или отключат в qmode а то в модулях не отображает не как понять не могу

vqmod создает папку xml в своей директории, там и лежат собственно файлы, изменяющие стандартный функционал. Если переименовать расширение подобного файла (например, mod.xml0 вместо mod.xml), это приведет к "отключению" мода. Ну или можно просто удалить ненужный файл. Что же касается изменений, где-то была неплохая инструкция (пришлю в личке).

 

Также пришлю готовый файл вместе с vqmod'ом в ближайшее время (сейчас он не под рукой).

Ок. буду ждать

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Чтобы к фотке не дополнялись маленькие изображения, в админке можно размеры приравнять, а вот почему идет дубликат привьюшки я не понял ...

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Похожий контент

    • От colaweb
      3 000.00 руб
      Скачать/Купить дополнение


      Анимация для вашего магазина или сайта
      Сделаю анимацию для вашего магазина или сайта.
      Большой опыт работы.
       
      Примеры
      Анимация главной страницы
      «Эффект полета» картинки в корзину при клике на кнопку "купить"
       
      Мой портфолио на форуме
      https://opencartforum.com/profile/12157-colaweb/content/?type=downloads_file
      Добавил colaweb Добавлено 19.02.2018 Категория Услуги  
    • От Orkh3ll0
      Все доброго дня

      Opencart version: 3.0.2.0
       
      в cart.twig изменил кнопку корзины
       
      <button type="button" data-toggle="dropdown" data-loading-text="{{ text_loading }}" id="btn1" class="btn btn-lg"><div class="row"><span id="cart-total">{{ text_items }}</span></div> <div class="row"><img src="image/icons/r3.png" id="cartimg"></div>{{ text_sebet }}</button> где {{ text_sebet }} добавил значения в языках. В HomePage все правильно показывает. Но при обновлении или добавлении товара не показывает значение {{ text_sebet }}
       
      Для этого в catalog/view/javascript/common.js изменил строку где изменяет кнопку корзины
       
      $('#cart > button').html('<div class="row"><span id="cart-total"> ' + json['total'] + '</span></div><div class="row"><img src="image/icons/r3.png" id="cartimg"></div>'); Как мне добавить {{ text_sebet }} в этот js файл? Пробовал добавить php код, пробовал приравнять к var foo = '{{ text_sebet }}'; и добавить переменную foo, но или не выходит текст или ошибка кода.
       
      Спасибо заранее за помощь
    • От Techno1og
      Уважаемые специалисты! Требуется доработать действующий магазин на Opencart 1.5.5:
       
      1. Добавить Https протокол (SSL ключ получен) . Прописать редиректы на новую версию.
      2. Добавить кроссбраузерную мобильную версию сайта, оптимизировать под стандарту.
      3. Обновить установленные модули отзывов, новостей, оплаты, доставки (магазин давно не обновлялся).
      4. Исправить внутренние ошибки сайта в css и javascript. Отредактировать robots.txt \ sitemap.xml
      5. Настроить 301 редирект на неработающие страницы. Определить все битые бэклинки.
      6. Оптимизация загрузки страниц сайта.
      7. Дать рекомендации для дальнейшего развития магазина.
       
      Интересует долгосрочное сотрудничество.
      Ссылку на сайт предоставим в л.с.
       
      Успехов.
    • От kiselovkiselev123
      Добрый вечер!
      Ни с чего перестала работать админка. Ну она работает, но половина кнопок и меню не работает.
      Судя по консоли:
        Request URL: https://72smesitelya.ru/admin/view/javascript/bootstrap/js/bootstrap.min.js Status Code: 404 Not Found   Не находит  файл. Пару часов все было нормально, сайт не трогал НИКТО! Uncaught TypeError: $(...).tooltip is not a function     at HTMLDocument.<anonymous> (common.js:175)     at j (jquery-2.1.1.min.js:2)     at Object.fireWith [as resolveWith] (jquery-2.1.1.min.js:2)     at Function.ready (jquery-2.1.1.min.js:2)     at HTMLDocument.I (jquery-2.1.1.min.js:2) (anonymous) @ common.js:175 j @ jquery-2.1.1.min.js:2 fireWith @ jquery-2.1.1.min.js:2 ready @ jquery-2.1.1.min.js:2 I @ jquery-2.1.1.min.js:2 Ошибка возникает тут commos js:
          $('[data-toggle=\'tooltip\']').tooltip({container: 'body', html: true});  
      Есть варианты?
       
    • От lambda371
      Всем доброго времени суток! Подскажите пожалуйста, как сделать скролл наверх при клике на страницу пагинации? есть страница категорий http://greenmarket.su/tovary
      При клике на след страницу экран остается на месте, а нужно чтобы он скроллился вверх. Как это можно осуществить?

      Код по моему вот такой:

      paginationChangeAction: function () { 
      $('.custom-category .pagination a').each(function () { 
      var href = $(this).attr('href'); 
      $(this).attr('onclick', 'oclayerednavigationajax.filter("'+ href +'")'); 
      $(this).attr('href', 'javascript:void(0);'); 
      }); 
      }
  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×