Не могу решить проблему с изображениями

Stasweb

Завсегдатай
1452
23 / 0

Не могу решить проблему с изображениями

« : 24.12.2015, 09:34:39 »

Не могу решить проблему с изображениями в товаре.
Страница товара с рабочими изображениями тут при нажатии на изображение главная картинка меняется.
Вторая страница товара не срабатывает хотя код у них одинаковый.
Помогите решить данную проблему с картинками.
Вот файл default_images.php

Спойлер

[свернуть]

тут только подправил с

Код

   jQuery(document).ready(function() {
    jQuery("a[rel=vm-additional-images]")
    .fancybox({
            "titlePosition"    :"inside",
         "transitionIn"   :   "elastic",
         "transitionOut"   :   "elastic"
      });

на

Код

var j$ = jQuery.noConflict();
j$(document).ready(function() {
    j$("a[rel=vm-additional-images]").fancybox({
        "titlePosition" : "inside",
        "transitionIn" : "elastic",
        "transitionOut" : "elastic"
    });
});

Так как выдавал ошибку добавил var j$ = jQuery.noConflict(); и заменил jQuery на j$ ошибка пропала но по прежнему не работает.
Вот файл default.php

Спойлер

[свернуть]

Конфликтов скриптов вроде нет не где в консоле все чисто.
Файлы fancybox подключены в шаблоне

Код

$this->addScript($this->baseurl.'/templates/'.$this->template.'/js/fancybox/jquery.fancybox-1.3.4.pack.js');
$this->addScript($this->baseurl.'/templates/'.$this->template.'/js/fancybox.js');

« Последнее редактирование: 02.11.2020, 12:58:48 от Stasweb »

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #1 : 24.12.2015, 11:46:18 »

В Google нет информации по данной проблеме кучу страниц пересмотрел но результата не нашел.

« Последнее редактирование: 24.12.2015, 12:36:23 от Stasweb »

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #2 : 25.12.2015, 07:36:29 »

Либо подскажите как сделать чтоб дополнительные картинки открывались также как основная а не в новом окне.
Пробовал менять с

Код

echo $image->displayMediaThumb('class="product-image" style="cursor: pointer"',false,"");

на

Код

echo $image->displayMediaThumb('class="product-image" style="cursor: pointer"',true,"");

в файле default_images.php

Спойлер

[свернуть]

то картинка просто открывается

« Последнее редактирование: 26.01.2017, 07:30:00 от Stasweb »

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #3 : 25.12.2015, 09:32:08 »

Работает вот такой вариант

Код

<?php
if(VmConfig::get('add_img_main', 1)) {
//echo $image->displayMediaThumb('class="product-image" style="cursor: pointer"',false,"");
echo '<div class="floatleft">' . $image->displayMediaThumb('class="product-image"', true, 'class="modal"', true, true). '</div>'; //'class="modal"'

echo '<a href="'. $image->file_url .'"  class="product-image image-'. $i .'" style="display:none;" title="'. $image->file_meta .'" rel="vm-additional-images"></a>';
} else {
echo $image->displayMediaThumb("",true,"rel='vm-additional-images'");
}
?>

но теперь при нажатии на маленькую картинку нет стрелок для перехода назад в перед.
Подскажите как это решить

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #4 : 20.01.2016, 06:51:43 »

Проблема так и не решена пришлось запустить сайт так Страница товара.
Подскажите что можно использовать для того чтоб при нажатии на миниатюру главное изображение менялось.
Желательно так чтоб главное изображение можно было еще и увеличить.

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #5 : 21.01.2016, 12:00:07 »

Вот весь код файла /html/com_virtuemart/productdetails/default_images.php

Код

<?php
/**
 *
 * Show the product details page
 *
 * @package	VirtueMart
 * @subpackage
 * @author Max Milbers, Valerie Isaksen

 * @link http://www.virtuemart.net
 * @copyright Copyright (c) 2004 - 2010 VirtueMart Team. All rights reserved.
 * @license http://www.gnu.org/copyleft/gpl.html GNU/GPL, see LICENSE.php
 * VirtueMart is free software. This version may have been modified pursuant
 * to the GNU General Public License, and as distributed it includes or
 * is derivative of works licensed under the GNU General Public License or
 * other free or open source software licenses.
 * @version $Id: default_images.php 6188 2012-06-29 09:38:30Z Milbo $
 */
// Check to ensure this file is included in Joomla!
defined('_JEXEC') or die('Restricted access');
if(VmConfig::get('usefancy',1)){
	vmJsApi::js( 'fancybox/jquery.fancybox-1.3.4.pack');
	vmJsApi::css('jquery.fancybox-1.3.4');
	$document = JFactory::getDocument ();
/*	$imageJS = '
	jQuery(document).ready(function() {
    jQuery("a[rel=vm-additional-images]")
    .fancybox({
            "titlePosition" 	:"inside",
			"transitionIn"	:	"elastic",
			"transitionOut"	:	"elastic"
		});

  		jQuery(".additional-images a.product-image.image-0").removeAttr("rel");
		jQuery(".additional-images img.product-image").click(function() {
			jQuery(".additional-images a.product-image").attr("rel","vm-additional-images" );
			jQuery(this).parent().children("a.product-image").removeAttr("rel");
			var src = jQuery(this).parent().children("a.product-image").attr("href");
			jQuery(".main-image img").attr("src",src);
			jQuery(".main-image img").attr("alt",this.alt );
			jQuery(".main-image a").attr("href",src );
			jQuery(".main-image a").attr("title",this.alt );
			jQuery(".main-image .vm-img-desc").html(this.alt);
		});
	});
    ';   */
$imageJS = '
var j$ = jQuery.noConflict();
j$(document).ready(function() {
    j$("a[rel=vm-additional-images]").fancybox({
        "titlePosition" : "inside",
        "transitionIn" : "elastic",
        "transitionOut" : "elastic"
    });
});

  		jQuery(".additional-images a.product-image.image-0").removeAttr("rel");
		jQuery(".additional-images img.product-image").click(function() {
			jQuery(".additional-images a.product-image").attr("rel","vm-additional-images" );
			jQuery(this).parent().children("a.product-image").removeAttr("rel");
			var src = jQuery(this).parent().children("a.product-image").attr("href");
			jQuery(".main-image img").attr("src",src);
			jQuery(".main-image img").attr("alt",this.alt );
			jQuery(".main-image a").attr("href",src );
			jQuery(".main-image a").attr("title",this.alt );
			jQuery(".main-image .vm-img-desc").html(this.alt);
		});

    ';

} else {
	vmJsApi::js( 'facebox' );
	vmJsApi::css( 'facebox' );
	$document = JFactory::getDocument ();
	$imageJS = '
	jQuery(document).ready(function() {
		jQuery("a[rel=vm-additional-images]").facebox();

		var imgtitle = jQuery("span.vm-img-desc").text();
		jQuery("#facebox span").html(imgtitle);


	});
	';
}
$document->addScriptDeclaration ($imageJS);

if (!empty($this->product->images)) {
	$image = $this->product->images[0];
	?>
	<div class="main-image">
<?php echo $image->displayMediaFull("",true,"rel='vm-additional-images'"); ?>

		<div class="clear"></div>
	</div>

	<?php
	$count_images = count ($this->product->images);
	if ($count_images > 1) {
		?>
		<div class="additional-images">
			<?php
			$start_image = VmConfig::get('add_img_main', 20)? 0 : 1;
			for ($i = $start_image; $i < $count_images; $i++) {
				$image = $this->product->images[$i];
				?>
				<div class="floatleft">
					<?php
					if(VmConfig::get('add_img_main', 1)) {
						//echo $image->displayMediaThumb('class="product-image" style="cursor: pointer"',false,"");
						echo '<div class="floatleft">' . $image->displayMediaThumb('class="product-image image-"', true, 'class="modal"', true, true). '</div>'; //'class="modal"'

						echo '<a href="'. $image->file_url .'"  class="product-image image-'. $i .'" style="display:none;" title="'. $image->file_meta .'" rel="vm-additional-images"></a>';
					} else {
						echo $image->displayMediaThumb("",true,"rel='vm-additional-images'");
					}
					?>
				</div>
			<?php
			}
			?>
			<div class="clear"></div>
		</div>
	<?php
	}
}
// Showing The Additional Images END
?>

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #6 : 21.01.2016, 13:13:21 »

Может кто подскажет как можно поменять размер всплывающего окна.
И как добавить стрелки при клике на маленькое изображение

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #7 : 22.01.2016, 12:50:12 »

Сделал так теперь маленькие картинки листаются но по 2 раза

Спойлер

[свернуть]

Как сделать чтоб было по одной
https://lik-astana.kz/oformlenie-v-baget-ramki/oformlenie-kollektsionnogo-oruzhiya-detail.html

Записан

Liss

Захожу иногда
238
10 / 0

Re: Не могу решить проблему с изображениями

« Ответ #8 : 25.01.2016, 16:17:26 »

стрелок нет, т.к. у ссылки на крупную картинку (у доп. изображений) нет атрибута rel="vm-additional-images"

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #9 : 27.01.2016, 13:51:30 »

Вот так не спасает ситуации

Код

<div class="floatleft">
<?php
if(VmConfig::get('add_img_main', 1)) {
echo '<div class="floatleft">' . $image->displayMediaFull('class="product-image image-"', true, 'class="modal"', true, true,"rel='vm-additional-images'"). '</div>'; //'class="modal"'
echo '<a href="'. $image->file_url .'"  class="product-image image-'. $i .'" style="display:none;" title="'. $image->file_meta .'" rel="vm-additional-images"></a>';
} else {
echo $image->displayMediaThumb("",true,"rel='vm-additional-images'");
}
?>
</div>

Вот страница с кучей миниатюр и что интересно что при клике на миниатюру описание меняется о картинка ент

Записан

Liss

Захожу иногда
238
10 / 0

Re: Не могу решить проблему с изображениями

« Ответ #10 : 27.01.2016, 20:24:02 »

на этой странице я вижу, что все превью открываются в модальном окне
надо бы вернуться к оригинальному коду и начать заново

я в яве не силен, от слова совсем, но такую конструкцию
var j$ = jQuery.noConflict();
j$(document).ready(function() {

});
вижу впервые.
$(document).ready(function() {
тут основной ява код
}); - вот это знаю - это функция на базе JQuery, которая откладывает исполнение кода до момента, пока не загрузится весь документ. А вот прилепленный сюда как-то странно noconflict - какой-то странный

На сколько мне известно, noconflict должен вызываться сразу после подключения библиотеки JQuery (т.е. до загрузки других внешних или встроенных в тело документа скриптов). По опыту знаю, что вызов noconflict в какое-то другое время дает совершенно другой эффект. Лично я его не использую вовсе, т.к. именно с ним у меня приходят все ошибки JS кода, использующего библиотеку JQuery

Записан

robert

Живу я здесь
4974
457 / 20

Re: Не могу решить проблему с изображениями

« Ответ #11 : 28.01.2016, 00:06:08 »

Тему еще не читал и, наверное, не буду. По поводу алиаса j$ - да, странный

, но работать будет. И jQuery.noConflict() можно вызывать везде, где нужно вернуть управление предыдущей версии jQuery.

Записан

Не будь паразитом, сделай что-нибудь самостоятельно!

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #12 : 28.01.2016, 07:49:43 »

Если не вызывать jQuery.noConflict() то лезут ошибки в консоль.
Было так jQuery(document).ready(function() и это не работало заменил на j$(document).ready(function() стало работать нормально.

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #13 : 28.01.2016, 09:15:43 »

Теперь в мазиле и в ie стали лететь миниатюры при наведении
https://lik-astana.kz/
Не могу понять в чем проблема

« Последнее редактирование: 26.01.2017, 07:28:09 от Stasweb »

Записан

Liss

Захожу иногда
238
10 / 0

Re: Не могу решить проблему с изображениями

« Ответ #14 : 28.01.2016, 11:51:26 »

noconflict уже вызывается в 62 строке, повторно не нужно
попробуй $(document).ready(function() { без J
попробуй jquery 1.8.3, а не 1.11; т.к. fancybox 1.3.4 - древний - 2010 год

Записан

Stasweb

Завсегдатай
1452
23 / 0

Re: Не могу решить проблему с изображениями

« Ответ #15 : 28.01.2016, 12:45:14 »

Так может fancybox обновить.
Его же вроде как в index.php

Код

$this->addScript($this->baseurl.'/templates/'.$this->template.'/js/fancybox/jquery.fancybox-1.3.4.pack.js');
$this->addScript($this->baseurl.'/templates/'.$this->template.'/js/fancybox.js');

и в файле где я его подключаю поменять и все

Код

vmJsApi::js( 'fancybox/jquery.fancybox-1.3.4.pack');

Записан

Liss

Захожу иногда
238
10 / 0

Re: Не могу решить проблему с изображениями

« Ответ #16 : 28.01.2016, 14:47:17 »

fancybox 2 - уже отдельный проект, под него даже сайт отдельный создали.
Осилишь поменять? Там же не только подключение другого внешнего .js, там часть кода в теле документа. Fancybox это не только фото, это еще добавление в корзину

Записан

Liss

Захожу иногда
238
10 / 0

Re: Не могу решить проблему с изображениями

« Ответ #17 : 20.02.2016, 14:11:24 »

В связи с установкой BT Media Gallery, использующей fancybox 2.1.3, пришлось VM2 так же перевести на него (иначе конфликт при попытке вывести галерею в карточке товара).
Итак:
в файле /administrator/components/com_virtuemart/helpers/vmjsapi.php в районе 300 строки вместо vmJsApi::js( 'fancybox/jquery.fancybox-1.3.4.pack'); пишем что-то типа vmJsApi::js( 'fancybox/jquery.fancybox-2.pack'); - это зависит от того, какое имя у файла новой библиотеки . Само собой сам jquery.fancybox.pack-2.js предварительно кладем в /components/com_virtuemart/assets/js/fancybox/. Сюда /components/com_virtuemart/assets/css кладем таблицу стилей от второго фэнси и его графику (кнопки, иконки, фон и т.д) и вместо vmJsApi::css('jquery.fancybox-1.3.4'); пишем vmJsApi::css('jquery.fancybox-2'); - так же смотрим реальное имя

в файле /components/com_virtuemart/assets/js/vmprices.js в районе 62 строки вместо $.fancybox.showActivity(); пишем $.fancybox.showLoading();
строки ниже (примерно с 77 по 82)

Код

"titlePosition" : 	"inside",
"transitionIn"	:	"fade",
"transitionOut"	:	"fade",
"changeFade"    :   "fast",
"type"			:	"html",
"autoCenter"    :   true,
"closeBtn"      :   false,
 "closeClick"    :   false,
"content"       :   txt

меняем на

Код

"openEffect"	: "fade",
"closeEffect"	: "fade",
"type"			:	"html",
"autoCenter"    :   true,
"closeBtn"      :   true,
"closeClick"    :   false,
 "content"       :   txt

при желании значения этих параметров (кроме type и content) можно задать другими, плюс добавить дополнительные (заголовок для окошка, его положение и т.д), примеры есть на оф. сайте http://fancyapps.com/fancybox/

Правки в файле /components/com_virtuemart/assets/js/vmprices.js касаются окошка добавления в корзину. Для окошка просмотра фото продуктов, так же будет необходимо скорректировать аналогичные параметры. У меня шаблон от Gavick, кусок кода с параметрами фэнсибокса находится в шаблоне карточки товара. Вероятно, в других фреймворках этот код где-то в другом месте может быть.

« Последнее редактирование: 21.02.2016, 13:27:21 от Liss »

Записан

Не могу перевести reviews Автор 4yBaK	Ответов: 2 Просмотров: 352	10.09.2018, 17:02:19 от Sandruk1
Не могу настроить вывод 3-х картинок в каталоге товаров Автор o_fedor	Ответов: 0 Просмотров: 505	19.02.2017, 20:26:17 от o_fedor
Не могу дать приличный вид <select> Автор Bagijan	Ответов: 1 Просмотров: 496	29.06.2016, 13:28:27 от gartes
РЕШЕНО: Не могу удалить сортировку по товарам в категориях! Автор stylus83	Ответов: 3 Просмотров: 561	30.12.2015, 17:04:17 от stylus83
Пакетная загрузка изображений в товар - как решить всеобщую проблему? Автор maxigran	Ответов: 19 Просмотров: 9502	03.12.2015, 12:27:46 от Stasweb

Новая функция в Joomla 4: процессы публикации

Интеграция форм обратной связи и Битрикс 24 на сайте Joomla

Об уязвимости Joomla. Так ли уязвима Joomla?

Похожие темы