0 Пользователей и 1 Гость просматривают эту тему.
  • 27 Ответов
  • 3984 Просмотров
*

NepaGoda

  • Захожу иногда
  • 54
  • 0 / 0
Как реализовать такой вывод атрибутов..

В виде изображений, да с выделением таким при нажатии..
« Последнее редактирование: 29.09.2012, 12:51:32 от NepaGoda »
*

NepaGoda

  • Захожу иногда
  • 54
  • 0 / 0
видимо нет..
*

srg

  • Захожу иногда
  • 209
  • 41 / 1
видимо нет..
Вообще-то ДА! Перепиливайте шаблон вывода продукта, а точнее CSS. Нужно воспользоваться Google с запросом типа "Стилизация радио боксов на CSS и jQuery", почитать http://followdesign.com/development/2011/11/28/oformlenie-knopok-chekboksov-i-drugih-elementov-interfeysa.html , и одним из понравившихся методов заменить стандартный контрол радио на свою галочку, точку, рамку или что душе угодно... Немного CSS, jQuery и контролы уникальные.
Только помните, для стандартного контрола не указывайте display:none, IE перестают обрабатывать такие скрытые радио батоны, нужно для радио кнопки сделать position:absolute;left:-5000px; тогда его никто не увидит и для IE он будет не скрытым...
*

linykc

  • Осваиваюсь на форуме
  • 30
  • 13 / 0
вижу что тема не нова, но в свое время сам с этим сильно заморачивался, поэтому выложу свое решение, может кому пригодится.

работает для атрибутов типа radio, должны быть загружены картинки обязательно (атрибут цвет например).

ie 9+ правда.
но зато без скриптов

CSS

Код: css
.jshop.productfull .jshop_prod_attributes { margin-bottom:20px; width:300px; float:left;}
.jshop.productfull .jshop_prod_attributes .input_type_radio{ float:left;width:54px; height:54px; overflow:hidden; display:block; position:relative;}
.jshop.productfull .jshop_prod_attributes .input_type_radio input{ position:absolute; z-index:-1; left:5px; top:5px;}
.jshop.productfull .jshop_prod_attributes  .input_type_radio span.radio_attr_label {text-indent:-9999px; font-size:0px;}
.jshop.productfull .jshop_prod_attributes  .input_type_radio span.radio_attr_label img { cursor:pointer; border:solid 2px; border-color:transparent; width:50px; height:50px; position:relative; z-index:2;}
.jshop.productfull .jshop_prod_attributes  .input_type_radio input[type="radio"]:checked+label img { border:solid 2px #4a3a0f; }


для ei8 условным коментанием можно добавить вот такую строчку.

Код: css
.jshop.productfull .jshop_prod_attributes .input_type_radio input{ position:absolute; z-index:5; width:54px; height:54px; left:0px; top:0px; outline:none;}
радио батон будет висеть посреди картинки и активироваться при клике на нее, но z-index должен быть выше чем у картинки.

ну и для остальных осликов аналогично
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
А можно ли реализовать вывод этих атрибутов в отдельном окне?
*

Linfuby

  • Завсегдатай
  • 1242
  • 176 / 0
  • Всё просто...
кх кх...
Чуть кофе не подавился...
Можно всё. Вопрос только зачем...
Немного воображения и логики, и любая проблема становится решенной.
Кривые решения - дают кривой результат!
Решения для JoomShopping
Благодарности и поддержка принимаются по след. реквизитам:
Яндекс.Деньги - 41001751720054
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
кх кх...
Чуть кофе не подавился...
Можно всё. Вопрос только зачем...
Ну если атрибутов слишком много и хочется вывести их во всплывающем окне и выбрать уже там) Я к сожалению далёк от этого и не знаю как это сделать)
*

Linfuby

  • Завсегдатай
  • 1242
  • 176 / 0
  • Всё просто...
Ну если атрибутов слишком много
Это сколько? Давайте исходить из реалий нашей жизни... Максимальное количество атрибутов я видел в магазине мебели, где продавали "супер "стенку"".
Слово "стенка" не зря в дополнительных ковычках.
Итого 10-12 атрибутов. Это не так много чтобы выводить в дополнительном окне...
Именно поэтому я спросил - "Зачем".
Аргументы "Я так хочу" и "Так хочет заказчик" не принимаются. Принимается только аргумент - "У меня столько-то атрибутов, надо оптимизировать"...
Немного воображения и логики, и любая проблема становится решенной.
Кривые решения - дают кривой результат!
Решения для JoomShopping
Благодарности и поддержка принимаются по след. реквизитам:
Яндекс.Деньги - 41001751720054
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
Ну в моём случае это ткани для мягкой мебели) их порядка штук 200, если не больше. Заказчика нет, я строю для себя сайт. Никаких знаний в программировани и даже в CSS и HTML нет) Обычно пишут модуль для выбора тканей, стоит он на рынке фрилансеров 20-25 т.р. А если реализовать выбор аттрибутов в отдельном окне то это вполне достойный ответ на тот модуль) Но не знаю как там будет с нагрузкой на сервер и есть ли там подводные камни.
*

dmitry_stas

  • Легенда
  • 13151
  • 1234 / 8
Цитировать
их порядка штук 200
покажите картинку. пока по написанному я вижу 1 атрибут (выпадающий список), который имеет 200 опций, а не 200 атрибутов, которые надо все сразу вывести на странице
Тут дарят бакс просто за регистрацию! Успей получить!
Все советы на форуме раздаю бесплатно, то есть даром. Индивидуально бесплатно консультирую только по вопросам стоимости индивидуальных консультаций
*

nevigen

  • Moderator
  • 10431
  • 862 / 25
  • http://n*****n.com
мало того посмотрите раздел сайты на ЖШ там были сайты по мебели с аккордеонами для атрибутов сделано.
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
покажите картинку. пока по написанному я вижу 1 атрибут (выпадающий список), который имеет 200 опций, а не 200 атрибутов, которые надо все сразу вывести на странице
Да, вы правы. Я неправильно выразился. Атрибут один с 200 опциями. Вот пример, правда там пока 3 опции но что будет если их будет 200? http://mk-maar.ru/index.php/internet-magazin/sofa/divan
*

nevigen

  • Moderator
  • 10431
  • 862 / 25
  • http://n*****n.com
а чем они во сплывающем окне удобнее ?
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
а чем они во сплывающем окне удобнее ?
а 3 атрибута по 200 опций в каждой разве будет смотреться красиво? Выбор во всплывающем окне мне казалось было бы удобнее)
*

nevigen

  • Moderator
  • 10431
  • 862 / 25
  • http://n*****n.com
чем ? я же и спрашиваю.. :)
тем что просто всплывает ? разница какая ?
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
Хотя бы тем что не заполнит всё пространство описания товара
*

dmitry_stas

  • Легенда
  • 13151
  • 1234 / 8
:) ну так вынесите атрибуты из описания :)
Тут дарят бакс просто за регистрацию! Успей получить!
Все советы на форуме раздаю бесплатно, то есть даром. Индивидуально бесплатно консультирую только по вопросам стоимости индивидуальных консультаций
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
А как их  вынести?  ::)
*

nevigen

  • Moderator
  • 10431
  • 862 / 25
  • http://n*****n.com
http://prntscr.com/2l8a0k
......Заказчика нет, я строю для себя сайт. Никаких знаний в программировани и даже в CSS и HTML нет)......
значит надо либо приобретать знания, либо Вы сами описывали второй путь.
попробуйте поискать что-то типа attributes в шаблоне
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
На приобретение знаний времени уже нет. Могу лишь предложить вознаграждение за помощь) Я очень долго возился и с шаблоном и с самим модулем JoomShopping. Но увы не получилось. А можно ли хоть Select доработать и сделать его с картинками?
« Последнее редактирование: 21.01.2014, 15:45:22 от Kusxov »
*

nevigen

  • Moderator
  • 10431
  • 862 / 25
  • http://n*****n.com
задайте атрибутам картинки.
сделайте их радиобатонами
и стилизируйте чтобы видны были только лейблы не инпуты
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !
*

Kusxov

  • Новичок
  • 9
  • 0 / 0
Помогите мне хоть сделать там какой нибудь бокс чтобы скрывать эти атрибуты, а когда нужно раскрывать.
*

nevigen

  • Moderator
  • 10431
  • 862 / 25
  • http://n*****n.com
1. в шаблоне пернесите ниже их, чтобы были по ширине больше.
2. не чек бокс а загоните их в просмотре со скролом просто и все.. бует Ваша пробелма решена
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !
*

bautina

  • Новичок
  • 8
  • 0 / 0
вижу что тема не нова, но в свое время сам с этим сильно заморачивался, поэтому выложу свое решение, может кому пригодится.

работает для атрибутов типа radio, должны быть загружены картинки обязательно (атрибут цвет например).

ie 9+ правда.
но зато без скриптов

CSS

Код: css
.jshop.productfull .jshop_prod_attributes { margin-bottom:20px; width:300px; float:left;}
.jshop.productfull .jshop_prod_attributes .input_type_radio{ float:left;width:54px; height:54px; overflow:hidden; display:block; position:relative;}
.jshop.productfull .jshop_prod_attributes .input_type_radio input{ position:absolute; z-index:-1; left:5px; top:5px;}
.jshop.productfull .jshop_prod_attributes  .input_type_radio span.radio_attr_label {text-indent:-9999px; font-size:0px;}
.jshop.productfull .jshop_prod_attributes  .input_type_radio span.radio_attr_label img { cursor:pointer; border:solid 2px; border-color:transparent; width:50px; height:50px; position:relative; z-index:2;}
.jshop.productfull .jshop_prod_attributes  .input_type_radio input[type="radio"]:checked+label img { border:solid 2px #4a3a0f; }


для ei8 условным коментанием можно добавить вот такую строчку.

Код: css
.jshop.productfull .jshop_prod_attributes .input_type_radio input{ position:absolute; z-index:5; width:54px; height:54px; left:0px; top:0px; outline:none;}
радио батон будет висеть посреди картинки и активироваться при клике на нее, но z-index должен быть выше чем у картинки.

ну и для остальных осликов аналогично


все замечательно работало по вашему рецепту пока я не захотела открыть их во всплывающем окне через modal.js встроенный плагин Joomla...не могу понять почему в модальном окне не работает, стили те же, но вот по label уже не переключается, есть идеи?
*

pvi1

  • Давно я тут
  • 566
  • 16 / 2
1. в шаблоне пернесите ниже их, чтобы были по ширине больше.
2. не чек бокс а загоните их в просмотре со скролом просто и все.. бует Ваша пробелма решена
Как правильно я понял -
Код
.класс дива {
overflow: scroll;
}
и задаем размеры дива?
*

nevigen

  • Moderator
  • 10431
  • 862 / 25
  • http://n*****n.com
типа да
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !
*

pvi1

  • Давно я тут
  • 566
  • 16 / 2
Цитата: bautina
все замечательно работало по вашему рецепту пока я не захотела открыть их во всплывающем окне через modal.js встроенный плагин Joomla...не могу понять почему в модальном окне не работает, стили те же, но вот по label уже не переключается, есть идеи?
Так вы что хотите: картинку опции открыть в всплывающем окне или опции атрибута открыть в нем?
Если первое - то было на форуме решение http://joomlaforum.ru/index.php/topic,217413.msg1139746.html#msg1139746. Если второе - то вам надо создать кнопку, по клику которой появлялось всплывающее окно с лейбами опций
« Последнее редактирование: 02.03.2015, 22:09:20 от pvi1 »
*

pvi1

  • Давно я тут
  • 566
  • 16 / 2
Помогите мне хоть сделать там какой нибудь бокс чтобы скрывать эти атрибуты, а когда нужно раскрывать.
Решение есть для JS 3.x и 4.x. Пишите в личку
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Вывод номера телефона в списке заказов

Автор sifoz

Ответов: 8
Просмотров: 1843
Последний ответ 25.11.2023, 00:58:54
от nevigen
[JoomShopping 5] вывод товаров из дочерних категорий

Автор v42bis

Ответов: 14
Просмотров: 1228
Последний ответ 18.05.2023, 16:35:40
от nevigen
Интересный прием - связывание ссылками атрибутов товара

Автор Anton shop

Ответов: 5
Просмотров: 1480
Последний ответ 21.02.2023, 12:59:21
от nevigen
При выборе атрибутов в консоли setAttrValue is not defined

Автор Dolphin4ik_1

Ответов: 3
Просмотров: 374
Последний ответ 22.11.2022, 07:43:05
от kit2m2
Сортировка атрибутов

Автор misteri27

Ответов: 1
Просмотров: 874
Последний ответ 02.09.2022, 22:17:18
от victorantoniak