Помощь Не работает colorbox в статьях

Azazello77

Azazello77

Полезный
Регистрация
16 Май 2015
Сообщения
213
Реакции
16
Не могу настроить увеличение картинки в статьях (Каталог - статьи).

в товарах всё отлично, в статьях - по нулям

вот страница
Для просмотра ссылки Войди или Зарегистрируйся

класс прописан,
колорбокс подключен в header
но открывает картинку в новом окне...
 
Последнее редактирование:
Azazello77 написал(а):
Не могу настроить увеличение картинки в статьях (Каталог - статьи).

в товарах всё отлично, в статьях - по нулям

вот страница
Для просмотра ссылки Войди или Зарегистрируйся

класс прописан,
колорбокс подключен в header
но открывает картинку в новом окне...
Нажмите для раскрытия...

странно пытался сделать на дебаге! видимо у тебя что то перебивает этот клас обычный facebox подруби и не парься!
 
nulledpapa написал(а):
странно пытался сделать на дебаге! видимо у тебя что то перебивает этот клас обычный facebox подруби и не парься!
Нажмите для раскрытия...
fancybox ? с ним перестают другие скрипты работать(
 
facebox я же написал четко! с ним вообще не бывает конфликта в работе!

Скрытое содержимое доступно для зарегистрированных пользователей!
 
Azazello77 написал(а):
класс прописан,
колорбокс подключен в header
но открывает картинку в новом окне...
Нажмите для раскрытия...
А ты этот класс привязал к обработчику?
Код: 
  <head>
    <link rel="stylesheet" href="colorbox.css">
    <script src="jquery.min.js"></script>
    <script src="jquery.colorbox-min.js"></script>
  </head>
  <body>
    <a class='gallery' href='image1.jpg'>Photo_1</a>
    <script>
        jQuery('a.gallery').colorbox();  <======
    </script>
  </body>
 
bodnari94 написал(а):
:conf:я криворукий.. не выходит ничего
Нажмите для раскрытия...
А что ты сделал что бы ничего не вышло?
Файл jquery.colorbox-min.js подключен после jquery.min.js?
Как прописаны ссылки с картинками, какие классы ты им присвоил?
В конце файла ты привязал классы ссылок с картинками к обработчику jQuery('a.gallery').colorbox();??
 
Страница Для просмотра ссылки Войди или Зарегистрируйся. ru/partners

TryCatch написал(а):
А что ты сделал что бы ничего не вышло?
1.Файл jquery.colorbox-min.js подключен после jquery.min.js?
2.Как прописаны ссылки с картинками, какие классы ты им присвоил?
3. В конце файла ты привязал классы ссылок с картинками к обработчику jQuery('a.gallery').colorbox();??
Нажмите для раскрытия...
Перенес всю структуру со страницы товара, где колорбокс работает.
1. Да.
2. На странице товара


Код: 
 <a href="http://fsopt.  ru/image/cache/data/katalog/bakalea/imbir/imb.bel.fsopt.ru-600x600.jpg" title="Имбирь 1кг (10) маринованный Три-С белый имп " class="colorbox">
      <img src="http://fsopt.  ru/image/cache/data/katalog/bakalea/imbir/imb.bel.fsopt.ru-340x340.jpg" title="Имбирь 1кг (10) маринованный Три-С белый имп " alt="Имбирь 1кг (10) маринованный Три-С белый имп " id="image" data-zoom-image="http://fsopt.  ru/image/cache/data/katalog/bakalea/imbir/imb.bel.fsopt.ru-600x600.jpg" class="product-image-zoom img-responsive" /></a>

По аналогии поставил

Код: 
<a href="images/thumbnails/ks1.jpg" class="colorbox" ><img src="images/thumbnails/ks1.jpg" id="image"  /></a>

3. В конце файла на странице товара код

Код: 
<script type="text/javascript">
$(document).ready(function() {
        
     $("#image").elevateZoom({
        gallery:'image-additional-carousel',
        cursor: 'pointer',
        /*zoomType: "inner",*/
        galleryActiveClass: 'active'});
      
        $('.colorbox').colorbox({
        maxWidth:'95%',
        maxHeight:'95%',
        overlayClose: true,
        opacity: 0.5,
        current: "{current} of {total}",
        rel: "colorbox"
        });

      // Colorbox resize function
      var resizeTimer;
      function resizeColorBox()
      {
       if (resizeTimer) clearTimeout(resizeTimer);
        resizeTimer = setTimeout(function() {
            if (jQuery('#cboxOverlay').is(':visible')) {
                      jQuery.colorbox.load(true);
            }
        }, 300);
     }
    // Resize Colorbox when resizing window or changing mobile device orientation
    jQuery(window).resize(resizeColorBox);
    window.addEventListener("orientationchange", resizeColorBox, false);
  
});
  $('.carousel-tab-related').carousel({interval:false});
//--></script>


Перенес его целиком в низу статьи в режиме Источник


Страница Для просмотра ссылки Войди или Зарегистрируйся. ru/partners
 
Azazello77 написал(а):
Перенес его целиком в низу статьи в режиме Источник
Нажмите для раскрытия...
Ну и зря, бездумное копирование ни к чему хорошему не приводит.
Ф-ция elevateZoom не определена в контексте выполнения скрипта (TypeError: $(...).elevateZoom is not a function). Так что весь код который после нее просто не выполняется.
Я же писал:
Код: 
<script type="text/javascript">
$(document).ready(function() {
    $('.colorbox').colorbox({
       maxWidth:'95%',
       maxHeight:'95%',
       overlayClose: true,
       opacity: 0.5,
       current: "{current} of {total}",
       rel: "colorbox"
     });
);
</script>
 
TryCatch написал(а):
Ну и зря, бездумное копирование ни к чему хорошему не приводит.
Ф-ция elevateZoom не определена в контексте выполнения скрипта (TypeError: $(...).elevateZoom is not a function). Так что весь код который после нее просто не выполняется.
Нажмите для раскрытия...

вас понял, исправил,но результат тот же..

но вносил просто в контент, сейчас попробую вниз в tpl добавить

upd
по нулям(

updupd
нашел ошибку, заработало!
 
Последнее редактирование:
Войдите или зарегистрируйтесь для ответа.
Назад
Сверху