Вход • Регистрация

Зум в карточке товара

  •
  • 24 июля 2012 г.
  • Появилась необходимость сделать вот такой эффект http://ruseller.com/adds/adds2572/example/sample.html для карточки товара интернет-магазина.
    Ну в описании в принципе все понятно: подключаем скрипты + цсс, далее делаем класс 'cloud-zoom' и к нему применяется подключаемый скрипт, но вот как это прикрутить к shop.view.id.php сходу мне было не понятно. В тп мне сказали
    Цитата
    Это работа не очень большая, но и в рамках техподдержки мы произвести ее не можем. Для этого у нас есть служба заказов, где мы или наши партнеры обязательно Вам поможем за соответствующую плату.
    , ну понятно каждый зарабатывать хочет. В общем, покопавшись, я разобрался, и хотел бы поделится опытом, может, кому то понадобится.
    Открываем shop.view.id.php и заменяем строку
    Цитата
    echo '<a href="' . BASE_PATH . $img["link"] . '" rel="prettyPhoto[gallery' . $result["id"] . 'shop]">';
    на
    Цитата
    echo '<a href="' . BASE_PATH . $img["link"] . '"class = "cloud-zoom" rel="tintOpacity:0.5, smoothMove:5, zoomWidth:380, zoomHeight:380, adjustY:-4, adjustX:10">';

    В приложении есть скрипты + css и html для примера. А вот ссылка на инструкцию к данному плагину http://ruseller.com/adds/adds2572/example/howtouse.html
  •
  • 24 июля 2012 г.
  • Мне нужно чтобы в карточке товара зуум отображался с миниатюрами как на картинке. Попыталсо но ничего не получилось
    •
    • 03 августа 2012 г.
    • допилил, если еще актуально, то:

      Цитата

      //вывод изображений товара
      if (!empty($result["img"]))
      {
      echo '<div class="shop_all_img">';

      //foreach ($result["img"] as $img)

      $img = $result["img"][0];
      {
      switch ($img["type"])
      {
      case 'animation':
      echo '<a href="' . BASE_PATH . $img["link"] . '"class = "cloud-zoom" id="zoom1" rel="tintOpacity:0.5, smoothMove:5, zoomWidth:380, zoomHeight:380, adjustY:-4, adjustX:10">';
      break;
      case 'big_image':
      echo '<a href="' . BASE_PATH . $img["link"] . '">';
      break;
      }
      echo '<img src="' . $img["src"] . '">'
      . '</a> ';
      }


      foreach ($result["img"] as $img)
      {
      echo "<a class=\"cloud-zoom-gallery\" href=\"http://galereyanoskov.ru/" . $img["link"]."\"
      rel=\"useZoom:'zoom1', smallImage:'".$img["src"]."'\" >";
      echo'<img src="'.$img["src"].'" width=64px; height=64px;' .'">'
      .'</a> ';
      }
      echo '</div>';

      }

      адрес http://galereyanoskov.ru/ только поменяешь на свой и все!
      •
      • 20 апреля 2014 г.
      • echo'<img src="'.$img["src"].'" width=64px; height=64px;' .'">'
        Вот тут зачем нужны точка и лишние справа двойные кавычки???
      • 20 апреля 2014 г.
      • на v 5.3 не хочет работать. В чем может быть проблема??? для работы взят дефолтный shop.view.id.php с апрельской версии.
        •
        • 21 апреля 2014 г.
        • не работает скрипт или приведенный код?
          •
          • 21 апреля 2014 г.
          • ну вот, сейчас так: http://nasti.rusblogi.ru/shop/futbolka3/
            фигня какая-то получилась..
            • 22 апреля 2014 г.
            • Есть еще вот такой отличный скрипт, тоже просто подключается http://www.mind-projects.it/projects/jqzoom/demos.php#demo2
              •
              • 22 апреля 2014 г.
              • Да, есть такая вещь у меня, но работает тоже с джавой не новее 1.8.3 (2011.05.03: jQzoom Evolution 2.3 released)
                Кстати, есть отечественная разработка:
                http://zoomsl.tw1.ru/
                еще вроде проще, но как подключить не понимаю.
                Работает с джавой аж до самой последней - 2.1.0
            • 22 апреля 2014 г. , редакция: 22 апреля 2014 г.
            • У меня заработало)))
              Попробуйте замените файлы cloud-zoom.1.0.2.5.js и cloud-zoom.css (прилагаю) и подключите последний jQuery

              • 22 апреля 2014 г.
              • Спасибо, попробуем.
                а у нас начал "фурыкать" движок от http://zoomsl.tw1.ru/ , но пока код показать не могу, т.к. сейчас очень криво. Покопаемся еще, может "очеловечим"?
  •
  • 24 июля 2012 г.
  • А! И как сделать чтобы изображение не повторялось если вдруг маленькое? пробовал через no-repeat; тоже не вышло(
  •
  • 24 июля 2012 г.
  • попробуй "поиграть" с параметрами zoomWidth zoomHeight может помочь, у меня просто 2000х2000 разрешение всех фоток
    •
    • 24 июля 2012 г.
    • Для интернет-магагзина, конечно, хорошие фотки очень важны, но не таких-же размеров :)
      •
      • 24 июля 2012 г. , редакция: 24 июля 2012 г.
      • Больше не меньше, поджать всегда можно =)
        На сайте буду использовать 900х900, этого мне за глаза
  •
  • 25 июля 2012 г.
  • Очень похвально, что стали появляться такие темы на форуме.
    •
    • 25 июля 2012 г.
    • даааа... находилось бы еще решение задач темы)))
  •
  • 21 апреля 2014 г.
  • Оказывается проблема в том, что cloud-zoom.1.0.2 (за ветки 2.х и 3.х надо платить, не хотелось бы связываться) хочет работать только с библиотекой не новее jquery-1.8.3.js
    Друзья, если текущую версию на v5.3 diafan джава 2.0.3 (на офсайте последняя 2.1.0) заменить на jquery-1.8.3.js, не вылезут подлые проблемы?

Новости

  • Вышла очередная сборка DIAFAN.CMS 7.2.2
  • 18 июня
  • В сборке большое обновление demo-шаблона, дополнительная защита от спама, улучшение YML-импорта и еще много важного и интересного.
  • Не пропустите сборку DIAFAN.CMS 7.1.4
  • 24 апреля
  • В новой сборке совершили революцию в структурировании кастомизированной информации в шаблонах, добавили авторегистрацию пользователей, усовершенствовали защиту от спама, актуализировали накопительную скидку, а также улучшили производительность и стабильность работы системы.
  • Сборка DIAFAN.CMS 7.1.3
  • 12 января
  • После выхода сборки 7.1 мы выпустили уже три патча, в каждом из которых улучшаем административную часть сайта. Сборка DIAFAN.CMS 7.1.3 уже доступна к установке. 
Все новости

Форум

Перейти на форум