Перейти к содержимому


Делаем модное вертикальное меню (каталог)


  • Вы не можете ответить в тему
Сообщений в теме: 69

#1 R.Sergey

    Администратор

  • Администраторы
  • 2810 сообщений
Репутация: 332
Мастер

Отправлено 05 May 2012 - 03:52 PM

Делаем модное вертикальное меню (каталог)

Описание:
Оформление каталога в виде выпадающего меню с картинками категории на втором уровне.
Удобно использовать если в структуре каталога присутсвуют 3 уровня.
Пример представлен в Категории "Мониторы":
Первый уровень Категория "Мониторы"
Второй уровень Фирма производитель отображается с картинкой категории, например Asus или Aser.
Третий уроверь диагональ - 15 дюймов и т.п.

Если в Категории нет третьего уровня, подкатегории выпадают обычным списком. Например категория "Акустика".
Если в Категории нет третьего уровня но ко второму прикреплены изображения они выводятся в списке. Пример виден в Категории "Корпуса и БП"

Работоспособность проверена в Google Chrome, Firefox Mozilla, Opera, IE8.

Уcтановка:
1. Загрузите файлы через фтп сохраняя иерархию вложений.
3. Создайте блок и файла cat_tree_menu.tpl.html

Видеодемонстрация:
http://youtu.be/rW7YYA9YZRI

Скачать "Модное вертикальное меню (каталог)" v.01



хе-хе ))
  • 1

#2 verdem

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 75 сообщений
Репутация: 1
Начинающий
  • ГородПитер

Отправлено 19 May 2012 - 09:28 PM

Доброго времени суток!
Подскажите пожалуйста, а почему данное меню показывается не как в примере в левой колонке, а по ширине листа в 890 px, получается оно оказывается посередине страницы и все остальное из левой колонки тоже подстраивается под эту ширину.
те блоки,. что раньше были по середине страницы или вверху сдвигаются куда-то вправо.
попытки поменять что-то в файле стилей не дает результата, ширина не меняется.
Подскажите, что можно сделать в такой ситуации?

Прикрепленные файлы

  • Прикрепленный файл  primer.jpg   207.13К   176 Количество загрузок:

  • 0

#3 R.Sergey

    Администратор

  • Администраторы
  • 2810 сообщений
Репутация: 332
Мастер

Отправлено 19 May 2012 - 09:35 PM

Криво подключили, скорее всего стили Вашего дизайна влияют на меню. Делалось оно специально на дефолтный шаблон, чтобы потом каждый под себя подгонял.
  • 0

#4 verdem

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 75 сообщений
Репутация: 1
Начинающий
  • ГородПитер

Отправлено 20 May 2012 - 11:54 AM

Криво подключили, скорее всего стили Вашего дизайна влияют на меню. Делалось оно специально на дефолтный шаблон, чтобы потом каждый под себя подгонял.

в дефолтовый тоже вставляла, там оно в левой колонке, нормальное, но зато не переходит почему-то в подкатегории, они видны в списке, но в них не переключается...
не понятно, что не так...
  • 0

#5 R.Sergey

    Администратор

  • Администраторы
  • 2810 сообщений
Репутация: 332
Мастер

Отправлено 20 May 2012 - 12:02 PM

Специально только что установил (просто залил файлы и подключил блок) его, чтобы проверить. Все отлично работает и везде переходит.
Вот пример.
http://shopcms.vsupport.club/

Само собой с закрытыми глазами никто Вам решить проблему не поможет. Стоимость установки - 10$. Если не справитесь можете заказать.
  • 0

#6 verdem

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 75 сообщений
Репутация: 1
Начинающий
  • ГородПитер

Отправлено 20 May 2012 - 12:25 PM

на другом пробном сайте поставила - там всё работает под любым шаблоном...а тут вот такая фигня....
спасибо, может быть обращусь.
  • 0

#7 badisoft

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 5075 сообщений
Репутация: 786
Мастер

Отправлено 20 May 2012 - 04:54 PM

1. ИМХО, в инструкции не помешает написать о том, что если jquery уже подключен в head.tpl.html, то в cat_tree_menu.tpl.html его надо закомментировать или удалить. Мелочь, но уверен, что очевидна она не для всех. А jquery сейчас суют даже не в один из двух, а чуть ли не в каждый первый модуль.

2. Если название категории длинное и не влезает в одну строку в блоке, то получается не совсем красиво. Точнее, совсем не красиво.
  • 0
http://cpu.badisoft.ru (тестовый сайт), http://badisoft.ru (модули)

#8 R.Sergey

    Администратор

  • Администраторы
  • 2810 сообщений
Репутация: 332
Мастер

Отправлено 20 May 2012 - 05:38 PM

2. Ну так, пусть допиливают кому не нравится, там всего-то заменить картинку для ховера и немножко стиль подправить. Не думаю что это очень уж большая сложность если человек задумал самостоятельно магазин делать.

Ну может немного позже )) как ты говоришь "неспешно" подправлю и выложу обновление.
Когда разберусь с этим аяксом и хвостами, которые из-за него накопились.
  • 0

#9 badisoft

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 5075 сообщений
Репутация: 786
Мастер

Отправлено 20 May 2012 - 06:04 PM

там всего-то заменить картинку для ховера и немножко стиль подправить

Ага. Самую малость. Там тааааакой интереснейший css-файл :).
  • 0
http://cpu.badisoft.ru (тестовый сайт), http://badisoft.ru (модули)

#10 R.Sergey

    Администратор

  • Администраторы
  • 2810 сообщений
Репутация: 332
Мастер

Отправлено 20 May 2012 - 06:20 PM

Там тааааакой интереснейший css-файл


)))))))) ну там не одно меню....... там их много. А файл 1 для всех.

А в стилях там вроде 1 стиль всего подправить.
  • 0

#11 badisoft

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 5075 сообщений
Репутация: 786
Мастер

Отправлено 20 May 2012 - 06:30 PM

Я полез смотреть картинки - хм... LADIES и MENS. Вроде, в модуле таких картинок нет, да и ни к чему, не туалет коммерческий :).
Полез в css-файл, а там - на мой не особо сведущий взгляд - две трети файла вообще к этому модулю никаким боком.
Вот сижу, разбираюсь, режу лишнее. Заодно хоть с CSS немного познакомлюсь, что там к чему...
Картинки практически все (кроме двух) не используются в этом варианте меню, как я понял.
  • 0
http://cpu.badisoft.ru (тестовый сайт), http://badisoft.ru (модули)

#12 R.Sergey

    Администратор

  • Администраторы
  • 2810 сообщений
Репутация: 332
Мастер

Отправлено 20 May 2012 - 07:04 PM

Да просто в планах выложить еще штук 5. И у всех будет этот же файл стилей. Так что может не спеши резать. Хотя в любом случае оригинал останется.
  • 0

#13 pavelbred

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 194 сообщений
Репутация: 4
Начинающий

Отправлено 20 May 2012 - 11:53 PM

Подскажите по меню. При наведении мышкой выезжает подменю, если много категорий, то оно получается высокое и попадает под шапку сайта. То есть шапка сайта закрывает порядка 4-х категорий. Как исправить эту проблему?
  • 0

#14 R.Sergey

    Администратор

  • Администраторы
  • 2810 сообщений
Репутация: 332
Мастер

Отправлено 21 May 2012 - 12:29 AM

Позиционируйте блок с меню выше шапки
т.е. в стиле для блока с меню нужно дописать
z-index: 999
например.

Только блок при этом должно быть
position:related;
или
position:absolute;

но если стили не меняли, то оно там так и есть
  • 0

#15 pavelbred

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 194 сообщений
Репутация: 4
Начинающий

Отправлено 07 June 2012 - 11:55 PM

Интересен еще момент. Получается что менюшка которая выезжает состоит из трех столбцов, а если категорий много то общая картина уходит вниз. Подскажите как добавить столбцы? Чтобы их было не 3 а 6 например
  • 0

#16 mailomsk

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 135 сообщений
Репутация: 0
Начинающий
  • ГородОмск

Отправлено 23 June 2012 - 06:05 AM

попробовал поставить на 2 разных сайта. Появился серенький квадратик.Ни на стандартном шаблоне ни на других не отрабатывает скрипт.
библиотека только 1 подключается кьювери. Подскажите что еще можно проверить.
Вот ссылька
  • 0

#17 badisoft

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 5075 сообщений
Репутация: 786
Мастер

Отправлено 23 June 2012 - 10:36 AM

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

Подсказываю проверить утверждение про одну библиотеку. Лично я вижу две подключенных jquery-latest. Нажмите в FireFox Ctrl-U (Исходный код страницы) - увидите и Вы. Может, дело и не в них, но сначала надо устранить ЭТУ ошибку. Мне всегда помогало :).

PS. Может, Вы просто неправильно понимаете фразу "одна библиотека" и поленились прочитать предыдущие сообщения в этой теме? Цитирую "1. ИМХО, в инструкции не помешает написать о том, что если jquery уже подключен в head.tpl.html, то в cat_tree_menu.tpl.html его надо закомментировать или удалить."

"Закомментировать или удалить", а не закомментировать свой вариант jquery и прописать вместо него другой вариант из cat_tree_menu.tpl.html :)
  • 0
http://cpu.badisoft.ru (тестовый сайт), http://badisoft.ru (модули)

#18 mailomsk

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 135 сообщений
Репутация: 0
Начинающий
  • ГородОмск

Отправлено 23 June 2012 - 05:04 PM

PS. Может, Вы просто неправильно понимаете фразу "одна библиотека" и поленились прочитать предыдущие сообщения в этой теме? Цитирую "1. ИМХО, в инструкции не помешает
Нет! первым делом прочитал тему после того как не заработала менюшка, в компоненте закоментировал.
Потом просто все вернул обратно.

а не закомментировать свой вариант jquery и прописать вместо него другой вариант из cat_tree_menu.tpl.html
тоже пробовал, пробовал и библиотеку из шаблона и библиотеку из компонента и на стандартном шаблоне.
  • 0

#19 R.Sergey

    Администратор

  • Администраторы
  • 2810 сообщений
Репутация: 332
Мастер

Отправлено 23 June 2012 - 08:17 PM

mailomsk, почему Вы не пользуетесь кнопкой цитирования?
  • 0

#20 mailomsk

    Продвинутый пользователь

  • Assistent vsupport.club
  • PipPipPip
  • 135 сообщений
Репутация: 0
Начинающий
  • ГородОмск

Отправлено 25 June 2012 - 03:36 AM

R.Sergey, Прошу прощенья, очень спешил.

PS. Может, Вы просто неправильно понимаете фразу "одна библиотека" и поленились прочитать предыдущие сообщения в этой теме? Цитирую "1. ИМХО, в инструкции не помешает написать о том, что если jquery уже подключен в head.tpl.html, то в cat_tree_menu.tpl.html его надо закомментировать или удалить." "Закомментировать или удалить", а не закомментировать свой вариант jquery и прописать вместо него другой вариант из cat_tree_menu.tpl.html

Все это проделывал, перепробовал разные варианты, даже на разных хостингах и сайтах.
Сегодня еще поковыряю, если есть идеи почему или подсказка что еще проверить, буду рад.
  • 0