Сообщений в теме: 47

[lew]

вышлите скриншот пожалуйста. На моём браузере всё в порядке.
Сролл есть в левом меню - "вы смотрели"

[Vaccina]

В шаблоне Товар находим:

<div class="d-carousel">
<ul class="carousel">

меняем на:

<div class="d-carousel mycont">
<ul class="carousel mycarousel">

далее в main.css пишем:

.mycont{
   margin:0 auto;
   overflow:hidden;
}
.mycarousel li{
   width:400px;
   margin:0 10px;
}

далее в конце main.js вставьте:

$(function() {
$.fn.startCarousel = function() {
	var bodywidth = $('#primaryContent').width(),
   itemwidth = $('.mycarousel li').outerWidth(true), 
   mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
   licount = $('.mycarousel li').size(),
   jscroll = 1;
  
  if(licount > mycontwidth/itemwidth){
   jscroll =  mycontwidth/itemwidth;
  } else {
   jscroll = 0;
   mycontwidth = licount * itemwidth;
  }
 
  $('.mycont').width(mycontwidth);
});

если результат не будет нарушать вид сайта, но не будет особых изменений, то сохраните изменения, скорее всего в main.css надо будет старые стили поправить

[dfysdbu]

Vaccina (14 Май 2014 - 04:10) писал:

В шаблоне Товар находим:

<div class="d-carousel">
<ul class="carousel">

меняем на:

<div class="d-carousel mycont">
<ul class="carousel mycarousel">

далее в main.css пишем:

.mycont{
margin:0 auto;
overflow:hidden;
}
.mycarousel li{
width:400px;
margin:0 10px;
}

далее в конце main.js вставьте:

$(function() {
$.fn.startCarousel = function() {
var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;

if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}

$('.mycont').width(mycontwidth);
});

если результат не будет нарушать вид сайта, но не будет особых изменений, то сохраните изменения, скорее всего в main.css надо будет старые стили поправить

1) Карусель растягиваться не стала, наверное старые стили надо поправить, но исчезло оевое вертикальное меню, из за яваскрипта, пока всё вернул обратно, можно как то поправить?
2) Подскажите как добавить кнопку стоп для карусели?

[MikDark]

dfysdbu (14 Май 2014 - 17:42) писал:

1) Карусель растягиваться не стала, наверное старые стили надо поправить, но исчезло оевое вертикальное меню, из за яваскрипта, пока всё вернул обратно, можно как то поправить?
2) Подскажите как добавить кнопку стоп для карусели?

Растягиваем карусель по ширине страницы, ищем в main.css:

#wrapper {
width: 700px;
margin: 0 auto;
}

Меняем на:

#wrapper {
width: 90%;
margin: 0 auto;
}

Далее:

.d-carousel {
width: 700px;
}

меняем на:

.d-carousel {
width: 100%;
}

Находим:

.d-carousel .jcarousel-container-horizontal {
width: 700px;
height: 360px;
padding: 0 45px 0 30px;
}

и меняем на:

.d-carousel .jcarousel-container-horizontal {
width: 1300px;
height: 360px;
padding: 0 45px 0 30px;
}

Посмотрите. Теперь если нужна адаптивность, будем подстраивать под разные экраны.

[dfysdbu]

MikDark (14 Май 2014 - 20:49) писал:

Растягиваем карусель по ширине страницы, ищем в main.css:

#wrapper {
width: 700px;
margin: 0 auto;
}

Меняем на:

#wrapper {
width: 90%;
margin: 0 auto;
}

Далее:

.d-carousel {
width: 700px;
}

меняем на:

.d-carousel {
width: 100%;
}

Находим:

.d-carousel .jcarousel-container-horizontal {
width: 700px;
height: 360px;
padding: 0 45px 0 30px;
}

и меняем на:

.d-carousel .jcarousel-container-horizontal {
width: 1300px;
height: 360px;
padding: 0 45px 0 30px;
}

Посмотрите. Теперь если нужна адаптивность, будем подстраивать под разные экраны.

1) Всё зделал но карусель растянулась до 1300px но при приблежении не стягивается до 360px. и когда добавляется яваскрипт перестаёт нормально работать левое вертикальное меню оно просто идёт списком. (картинка ниже) Возможно поправить.

2) Подскажите как установить кнопку останавливающую эту карусель?

[Vaccina]

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

[dfysdbu]

Vaccina (16 Май 2014 - 02:32) писал:

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

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

[Vaccina]

ошибка в JS была коде выше:

$(function() {
$.fn.startCarousel = function() {
	 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;

if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}

$('.mycont').width(mycontwidth);
});

замените на:

$(function() {
$.fn.startCarousel = function() {
	 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;

if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}

$('.mycont').width(mycontwidth);
}});

еще не увидела у вас css

.mycont{
   margin:0 auto;
   overflow:hidden;
}
.mycarousel li{
   width:400px;
   margin:0 10px;
}

[dfysdbu]

Vaccina (17 Май 2014 - 02:37) писал:

ошибка в JS была коде выше:

$(function() {
$.fn.startCarousel = function() {
	 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;

if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}

$('.mycont').width(mycontwidth);
});

замените на:

$(function() {
$.fn.startCarousel = function() {
	 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;

if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}

$('.mycont').width(mycontwidth);
}});

еще не увидела у вас css

.mycont{
margin:0 auto;
overflow:hidden;
}
.mycarousel li{
width:400px;
margin:0 10px;
}

Изменения внёс!
Меню теперь работает, но карусель не сужается растягивается на максимум в зависимости от кода

.d-carousel .jcarousel-container-horizontal {
width: 1300px;
height: 360px;
padding: 0 45px 0 30px;
}

В данном случае растягивается на 1300px
Возможно поправить?

[Vaccina]

код у вас закомментирован, проблемы не вижу, как вариант, раскомментируйте код css, который просила выше прописать, далее в блоках

#wrapper {
	width: 700px;
/* width: 90%;*/
	margin: 0 auto;
}
.d-carousel {
width: 700px;
/* width: 100%;*/
}
.d-carousel .jcarousel-container-horizontal {
width: 700px;
/* min-width: 700px;
max-width: 1400px;*/
/* width: 1300px;*/
height: 360px;
padding: 0 45px 0 30px;
}

закомментируйте width: 700px;

на ночь оставьте изменения, чтобы смогла проверить

[dfysdbu]

Vaccina (20 Май 2014 - 01:47) писал:

код у вас закомментирован, проблемы не вижу, как вариант, раскомментируйте код css, который просила выше прописать, далее в блоках

#wrapper {
width: 700px;
/* width: 90%;*/
margin: 0 auto;
}
.d-carousel {
width: 700px;
/* width: 100%;*/
}
.d-carousel .jcarousel-container-horizontal {
width: 700px;
/* min-width: 700px;
max-width: 1400px;*/
/* width: 1300px;*/
height: 360px;
padding: 0 45px 0 30px;
}

закомментируйте width: 700px;

на ночь оставьте изменения, чтобы смогла проверить

1) Всё поставил на ночь как выше указано по инструкциям.

2) Подскажите ещё момент пожалуйста!
Помогите поиск поправить там тоже товар не коректно отображается 3-1-3, сам пробовал не совсем всё получилось правильно.

[Vaccina]

1.В main.js найдите:

//Карусель для с этим товаром смотрят
$(function() {
$.fn.startCarousel = function() {
		 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;
if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}
$('.mycont').width(mycontwidth);
}});
//END Карусель для с этим товаром смотрят

удалите, далее зайдите в шаблон Товар, найдите:

<script type="text/javascript">
jQuery(document).ready(function() {
// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
jQuery('.d-carousel .carousel').jcarousel({
scroll: 2,
auto: 2,
wrap: 'circular'
});
});
</script>

замените на:

<script type="text/javascript">
jQuery(document).ready(function() {
 
  //Карусель для с этим товаром смотрят
$.fn.startCarousel = function() {
 
 
		 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;
if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}
$('.mycont').width(mycontwidth);
jQuery('.d-carousel .carousel').jcarousel({
scroll: jscroll,
auto: 2,
wrap: 'circular'
});
};
//END Карусель для с этим товаром смотрят
 
 
// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
$(this).startCarousel();
});
</script>

2. В main.css найдите:

.goodsListItem {
	display: inline-block;
	list-style-type: none;
	margin: 12px;
	overflow: hidden;
	padding: 5px;
	text-align: center;
	vertical-align: top;
	width: 198px;
}

попробуйте заменить на:

.goodsListItem {
	display: inline-block;
	height: 320px;
	list-style-type: none;
	margin: 12px;
	overflow: hidden;
	padding: 5px;
	text-align: center;
	vertical-align: top;
	width: 198px;
}

[dfysdbu]

Vaccina (21 Май 2014 - 01:32) писал:

1.В main.js найдите:

//Карусель для с этим товаром смотрят
$(function() {
$.fn.startCarousel = function() {
		 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;
if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}
$('.mycont').width(mycontwidth);
}});
//END Карусель для с этим товаром смотрят

удалите, далее зайдите в шаблон Товар, найдите:

<script type="text/javascript">
jQuery(document).ready(function() {
// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
jQuery('.d-carousel .carousel').jcarousel({
scroll: 2,
auto: 2,
wrap: 'circular'
});
});
</script>

замените на:

<script type="text/javascript">
jQuery(document).ready(function() {

//Карусель для с этим товаром смотрят
$.fn.startCarousel = function() {


		 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;
if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}
$('.mycont').width(mycontwidth);
jQuery('.d-carousel .carousel').jcarousel({
scroll: jscroll,
auto: 2,
wrap: 'circular'
});
};
//END Карусель для с этим товаром смотрят


// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
$(this).startCarousel();
});
</script>

2. В main.css найдите:

.goodsListItem {
display: inline-block;
list-style-type: none;
margin: 12px;
overflow: hidden;
padding: 5px;
text-align: center;
vertical-align: top;
width: 198px;
}

попробуйте заменить на:

.goodsListItem {
display: inline-block;
height: 320px;
list-style-type: none;
margin: 12px;
overflow: hidden;
padding: 5px;
text-align: center;
vertical-align: top;
width: 198px;
}

1) Не сработало карусель всё рано не растягивается
2) ТО же не помогло всё равно встречаются разрешения когда товары отображаются 3-1-3

[Vaccina]

1. Почистите кэш, проверяли на вашем сайте код перед отправкой сообщения, все работало.
2. укажите ссылку пример на подобный товар.

[dfysdbu]

Vaccina (21 Май 2014 - 02:21) писал:

1. Почистите кэш, проверяли на вашем сайте код перед отправкой сообщения, все работало.
2. укажите ссылку пример на подобный товар.

1) Кешь почистил почему то у меня не растягивается карусель больше 3 х товаров и маленькой границы 4 го не появляется
2) При самых маленьких разрешениях например тут http://lusstore.ru/search?q=710

[Vaccina]

1. Вот пример в приложенном файле, размер брауезрного окна 1920, скрин сделан сейчас


2. Причина в табличном виде, в шаблоне Поиск просмотрите структуру товаров, она идет таблицей нежели в шаблоне Товары, тут два варианта или изменить структуру по аналогии с шаблоном Товары или сделать по 3 товара в ряд, для этого найдите:

{% IFNOT goods.last %}{goods.index | is_divided("4","</tr><tr>","")}{% ENDIF %}

замените на:

{% IFNOT goods.last %}{goods.index | is_divided("3","</tr><tr>","")}{% ENDIF %}

p.s.: 1. адаптивность проявляется при перезагрузке страницы или ее загрузки, при ручном изменении окна, размеры карусели неизменны

[dfysdbu]

Vaccina (21 Май 2014 - 02:42) писал:

1. Вот пример в приложенном файле, размер брауезрного окна 1920, скрин сделан сейчас
FireShot Screen Capture #068 - 'Люстра подвесная Odeon Light 2253_6 Swell' - lusstore_ru_goods_Lustra_Odeon_2253-6_from=NjRh.jpg

2. Причина в табличном виде, в шаблоне Поиск просмотрите структуру товаров, она идет таблицей нежели в шаблоне Товары, тут два варианта или изменить структуру по аналогии с шаблоном Товары или сделать по 3 товара в ряд, для этого найдите:

{% IFNOT goods.last %}{goods.index | is_divided("4","</tr><tr>","")}{% ENDIF %}

замените на:

{% IFNOT goods.last %}{goods.index | is_divided("3","</tr><tr>","")}{% ENDIF %}

p.s.: 1. адаптивность проявляется при перезагрузке страницы или ее загрузки, при ручном изменении окна, размеры карусели неизменны

1) Вы абсолютно правы карусель не меняется в ручном режиме, только при перезагрузке. А мне именно в ручном режиме надо было, так нельзя?
2) Нет 3 не пойдёт, лучше таблицу на div поменять попробую, можете помочь в этом?

[Vaccina]

1.

<script type="text/javascript">
jQuery(document).ready(function() {
//Карусель для с этим товаром смотрят
$.fn.startCarousel = function() {

				 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;
if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}
$('.mycont').width(mycontwidth);
jQuery('.d-carousel .carousel').jcarousel({
scroll: jscroll,
auto: 2,
wrap: 'circular'
});
};
//END Карусель для с этим товаром смотрят

// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
$(this).startCarousel();
});
</script>

попробуйте заменить на:

<script type="text/javascript">
jQuery(document).ready(function() {
//Карусель для с этим товаром смотрят
$.fn.startCarousel = function() {

				 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;
if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}
$('.mycont').width(mycontwidth);
jQuery('.d-carousel .carousel').jcarousel({
scroll: jscroll,
auto: 2,
wrap: 'circular'
});
};
//END Карусель для с этим товаром смотрят

// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
$(this).startCarousel();
$(window).resize(function(){
$(this).startCarousel();
});
});
</script>

2. В смене структуры ничего сложного нет, откройте шаблоны Товары и Поиск и сравните конструкцию выдачи самих товаров и скопируйте с шаблона Товары табличный вид и перенесите в Поиск, переменные у них одинаковые.

[dfysdbu]

Vaccina (22 Май 2014 - 01:36) писал:

1.

<script type="text/javascript">
jQuery(document).ready(function() {
//Карусель для с этим товаром смотрят
$.fn.startCarousel = function() {

				 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;
if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}
$('.mycont').width(mycontwidth);
jQuery('.d-carousel .carousel').jcarousel({
scroll: jscroll,
auto: 2,
wrap: 'circular'
});
};
//END Карусель для с этим товаром смотрят

// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
$(this).startCarousel();
});
</script>

попробуйте заменить на:

<script type="text/javascript">
jQuery(document).ready(function() {
//Карусель для с этим товаром смотрят
$.fn.startCarousel = function() {

				 var bodywidth = $('#primaryContent').width(),
itemwidth = $('.mycarousel li').outerWidth(true),
mycontwidth = bodywidth > itemwidth ? bodywidth - bodywidth%itemwidth : itemwidth,
licount = $('.mycarousel li').size(),
jscroll = 1;
if(licount > mycontwidth/itemwidth){
jscroll = mycontwidth/itemwidth;
} else {
jscroll = 0;
mycontwidth = licount * itemwidth;
}
$('.mycont').width(mycontwidth);
jQuery('.d-carousel .carousel').jcarousel({
scroll: jscroll,
auto: 2,
wrap: 'circular'
});
};
//END Карусель для с этим товаром смотрят

// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
$(this).startCarousel();
$(window).resize(function(){
$(this).startCarousel();
});
});
</script>

2. В смене структуры ничего сложного нет, откройте шаблоны Товары и Поиск и сравните конструкцию выдачи самих товаров и скопируйте с шаблона Товары табличный вид и перенесите в Поиск, переменные у них одинаковые.

Произвёл замену пропадает вся карточка товара!

[Vaccina]

так ведь в инструкции выше речь шла о шаблонах "Товары" и "Поиск", карточку товара не должны были затронуть изменения.
Карточка товаров у вас на данный момент работает.
Уточняйте после каких именно изменений перестает работать тот или иной шаблон.