Drunk_Monkey
-
Posts
22 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by Drunk_Monkey
-
-
Добрый день, реализовываю мега меню использую плагины Bootsrap: tabs и collapse
ссылка на прототип (codpen)Нужная логика:
- При клике на родительскую категорию (Одежда, Техника, Для дома) открываются в сайдбаре, ее дочерние категории. — реализовано
- По клику на дочернюю категорию открывается, в правой колонке, содержимое связанного с дочерней категорией таба — реализовано
- Подкатегории (Мужская одежда, Женская …) первой родительской категории (Одежда) открыты по умолчанию — реализовано
- При клике на другую родительскую категорию, открываются ее дочерние и скрываются дочерние категории, предыдущей активной — реализовано
- При клике на родительскую категорию и открытии ее дочерних должен активироваться таб связанный с первой дочерней категорией — частично реализовано, срабатывает только один раз (при первом клике, на последующих, не срабатывет)
- При повторном клике на родительскую категорию с открытыми дочерними, дочерние скрываются + скрываться таб связанный с одной из ее дочерних категоий — не реализовано скрытие таба
Возникли сложности со скрытием табов (последний пункт списка с логикой) и активацией таба первой дочерней категории, при клике по родительской.
Код:
$('li.panel').click(function() { $(this).children().find('a:first').tab('show');
Открывает таб первой подкатегории только один раз. Если я на примере кликну по род. категории «Техника», то откроются ее дочерние категории (Смартфоны, Планшеты) и активируется так первой подкатегории (Смартфоны) скриншот, но если если я после этого, к примеру, кликну по другой род. категории «Одежда», а потом снова кликну по категории «Техника», таб связанный с первой дочерней «Смартфоны» не будет активен — скриншот.
-
используйте :after
К примеру:
.accordion-header li { position: relative; padding-right: 15px; /* Чтобы текст не «залазил» на символ*/ } .accordion-header li:after{ position: absolite; font-family: "названиеш шрифта"; /*Если нужен опеределнный шрифт*/ content: "+"; right: 0; /* Если размещаете справа*/ }
- 1
-
Подскажи как решить задачу:
- Верстка выдачи товаров в категории, с учетом того что кол-во товаров может быть произвольный, и к тому же нечетным кол-ву товаров к колонке
- Верстать нужно на bootstrap c учетом адаптива (2,3 4 — карточки в ряду, в зависимости от брейкпоинта) поэтому использовать display: tabel и table-cell не имеет смысла
- Не должно быть двойных границ у карточек на стыке по вертикали и горизонтали
- Горизонтальных и вертикальных отступов между карточками нет
Решил задавать границы используя nth-child, меняя формулы для разных брекпойнтов.
Ссылка на демо
Не испробовав, даже адаптив, увидел проблему на стыке границ, если карточки в последнем ряду, не кратны кол-ву колонок:Если более правильное решение задачи и почему границы не сходятся на стыке?
-
Нашел решение как сделать оглавление через css
-
Подскажите пожалуйста как можно реализовать, подобный блок, отдельно учитывая, его поведение при адаптиве, при уменьшение viewport уже ширины блока. Также то, что длина каждой надписи может меняться.
-
Добрый день, подскажите пожалуйста, как реализовать поведение карточки товара при ховере как на странице магазина ikea
-
Добрый день, у меня задача нарисовать адаптивную версию дизайна сайта под Twitter Bootstrap 3 или возможно 4 версии. Сложность в том, что в отличии от моего предыдущего опыта, верстальщики с которыми нужно будет взаимодействовать не работали с фрейморком и нужно будет их консультировать.
К примеру обычно рисовал макеты под стандартную сетку по шаблону Bootstrap psd grid- Grid template 320px container 30px gutter 53-54px
- Grid template 480px container 30px gutter 80px col
- Grid template 750px container 30px gutter 62-63px
- Grid template 970px container 30px gutter 80-81px
Вопросы:
- Как объяснить почему колонки сетки, которую я привел выше, разной ширины?
- Есть ли смысл рисовать под 970 px если текущий дизайн уже сверстанный под десктоп нормально отображаются на 1024 px?
- Что даст макет на 480 px, когда макет на 320 px и после верстки так будет масштабироваться на 480?
- В Bootstrap 4 брекпойнты по умолчанию в em (landscape phones - 34em. tablets- 48em) как в px рассчитать ширину и сетку psd макета?
-
Нашел вариант только с вложенными слоями:
Использование свойства box-sizing всем хорошо, кроме того, что не работает в старых версиях IE. Если вы верстаете сайт с учетом IE7 и IE6, вам подойдет старый проверенный метод с вложением слоев. Идея простая — для внешнего блочного элемента задаётся только необходимая ширина, а для вложенного блока всё остальное — поля, границы и отступы. Поскольку по умолчанию ширина блока равна доступной ширине родителя, получится, что блоки в каком-то смысле накладываются друг на друга, при этом фактическая ширина такого комбинированного элемента будет чётко задана.
Но он предусматривает лишнее теги (слой обвертка), есть ли варинат без добавления лишних div и box-sizing?
-
Добрый день буду благодарен помощи, условие для задачи только одно - без использования box-sizing
Немного непонятно, что вам именно нужно. Вы не могли бы описать задачу поподробнее и желательно с примерами и скринами.
Виноват отвечу подробней. Пример задачи: поля формы input должны быть резиновые, тянуться при измении ширины родителя, но при это иметь фиксимрованные отступы в 10 px.
В макете повторяются эта задача (резиновый эдемент с фиксированными отступами) не только для строчных элементов как поля но и для блочных.
-
Добрый день буду благодарен помощи, условие для задачи только одно - без использования box-sizing
-
Либо 1 вариант о чем я говорил выше с двумя списками см. тут http://codepen.io/anon/pen/tHxmq
Спасибо вам за помощь.
-
Дженьльмены и леди, подскажите как правильно верстать список навигации разделенный логотипом?
Примеры:
И
-
Спасибо, к вашему решению только добавил overflow-x, чтобы не было горизонтального скролла.
-
Добрый день, подскажите пожалуйста как реализовать тянущийся к краю браузера независимо от ширины его окно, но только по одной из его сторон.
В макете, серые блоки с текстом доходить до края окна браузера независимо от разрешения экрана монитора и ширины окна браузера.
Блок «ФАКТ №3» до правого края, а Блок «ФАКТ №4» до левого.
Буду благодарен вашей помощи.
-
Просто скачиваете php пакет (для виндоуса!) с офф. сайта и перезаливаете папку \usr\local\php5 кроме php.ini - оставляете.
Спасибо, за ответ.
-
Доброго времени суток всем буду благодарен подробной инструкции, по апгрейду php версии denwer, с с php 5.2 на php 5.3
-
То что вы спрашиваете, не относиться к вопросом верстки, все решается в админке Joomla. К примеру последний вопрос - вставить изображение через wysiwyg редактор вставить в статью категории необходимое изображение, и в его свойствах (в редакторе) указать обтекание текста слева или справа, и размер отступа.
Судя по характеру и постановке ваших вопросов, вы не знакомы с joomlа, даже на базовом уровне. Перед тем как задавать следующие вопросы прочитаете в началеХагена Графа «Руководства для начинающего пользователя Joomla! 2.5»
-
Уточню вопрос, моя вина нужно было сразу точно спрашивать, в каких версиях firefox и opera тестировать?
-
Подскажите пожалуйста, Верстаете ли вы с учетов голосовых браузеров и атрибуты abbr summary и прочие? Насколько это актуально в СНГ? Требуют ли этого иностранные заказчики?
-
Воспользовался статьей с Хабрхабр Браузерный зоопарк для того что бы установить 6,7,8 версии IE на свой ноутбук. Но возник вопрос относительно Opera и Firefoх, статье с Хабрхабр уже год, какие версии этих браузеров использовать для верстки на сегодняшний день?
В каких браузерах тестируете верстку вы?
-
Доброго воскресного утра, быстро раскланиваюсь со всеми и перехожу к сути дела:
В справочнике http://htmlbook.ru/html/cite указано что область применения тега <cite>
помечает текст как цитату или сноску на другой материалПри этом в примере:
<p><cite>Айзек Азимов</cite></p>
<p><q>Нельзя сказать человеку: «Ты можешь творить.
Так давай, твори». Гораздо вернее подождать, пока он
сам не скажет: «Я могу творить, и я буду творить, хотите
вы этого или нет».</q></p>Тег используется, для указания авторства. Это меня уже смутило.
В другом тематичном, русскоязычном источнике xiper.net также поддерживается эта точка зрения
.Тег <cite> (с англ. цитировать) — тег-контейнер, используется, чтобы указать источник цитаты или ее автора.Казалось бы какие могут быть вопросы? Для перестраховки посмотрел информацию по тегу /www.w3.org/wiki/HTML/Elements/cite и в версии HTML5 /www.w3.org/TR/html5/the-cite-element.html#the-cite-element
-
The <cite> element represents the title of a work.
здесь же четко указываться, что область применения тега - название работы, произвидения и т.д.<cite> не может использоваться для оформления цитирования.This is incorrect usage, because cite is not for quotes:<p><cite>This is wrong!</cite>, said Ian.</p>
Так какой же из вариантов употребления тега верный?
-
Доброго времени суток всем, подскажите пожалуйста пару вопросов по замечательному сабжу:
1) Как настроить сохранение и преобразование в UTF без BOM
2) Буду благодарен подсказке плагин которые позволяет сворачивать блоки кода анологично! Notepad++
3) Как настроить или какой плагин поставить что бы добиться соответствующего отображения -
а) "подчеркивание" красной вертикальной линией номеров строк которые относиться к выделенному тегу, функциии и т.д.
пример:
б) подчеркивание выделенного текста, при его дублировании, более заметным образом чем пунктирная линии идущая в Sublime Text 2 по умолчанию
пример:
4) Как включать/выключать перенос строк
Как удалить / изменить класс у «сквозного» блока на всех страницах
in JavaScript
Posted
Добрый день подскажите, как менять класс, буду очень благодарен примеру, у сквозного блока, который выводиться на всех страницах (к примеру блок с преимуществами в шапке сайта, который можно скрывать показывать по клику, если он скрыт на главной, то не будет показываться на других страницах, до клика по иконке)
И можно ли реализовать смену класса на определенное время (куки?) 1 час или сутки.