yustnip
-
Posts
30 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by yustnip
-
-
Спасибо, буду пробовать.
-
Спасибо за ответ. Я и планировал так сделать, но повторюсь, что при уменьшении ширины косые линии становятся прямыми и получается ужас. Ширина режется с края (где косая линия). Смотрел в сторону трансформации skew, но, насколько я знаю, она деформирует содержимое для искривления.
Плюс предполагаю еще возможную проблему с обработкой события наведения, т.к. прозрачность под косыми линиями будет наезжать на другие блоки и не срабатывать на нижних слоях.
В общем беда с этим слайдером.
-
Здравствуйте!
Есть задача сделать вот такой слайдер - https://yadi.sk/i/v6QfPqsxjcNdM (при наведении на каждый из трех кусочков изображений, соответствующее изображение должно появляться полностью, как бы раздвигаясь, уменьшая-сдвигая остальные).
Все было бы хорошо если бы не диагональная обрезка изображений, т.е. при уменьшении ширины изображения диагональный край обрезается и становится обычным.
Насколько возможно/сложно сделать такой слайдер? Буду очень признателен за наводку в какую сторону смотреть, чтобы такое реализовать.
-
Осилил Gulp, очень крутая штука оказалась. Прикрутил Stylus, Jade PHP со шлифовкой gulp-html-prettify. В Атоме хоткей на сборку настроил и красота.
Еще бы Jade PHP работал согласно документации, было бы совсем супер, ни в какую блоки PHP-вставки не генерирует целиком. -
Посмотрел, понял, что еще рано. Сначала надо до сборщиков морально прийти, хотя бы понять зачем и как.
-
Препроцессоры фигня, я потихоньку на постпроцессоры перелажу.
Ох, загуглил, нашлись только препроцессоры для станков с ЧПУ.
-
писец и чо люди в реале пользуются вот таким синтаксисом чтобы получить на выходе html ? Я видимо где-то в другом потоке жизни плыву =(
Еще и нахваливают и в требованиях в вакансиях указывают.
Мне после LESS идея на препроцессорах писать понравилась, вложенность ну очень рулит. -
Кстати, сейчас зашел на страничку дополнения и там есть опция pretty - https://atom.io/packages/jade-autocompile, по умолчанию вроде включено.
Хотя может не работать конечно корректно.
Получилось! Вот такая конструкция дала правильный отступ:
doctypehtml head meta( charset='utf-8' ) | | <?php wp_head(); ?>
-
Понятно, спасибо за ответы.
-
pretty: true как раз нужная вам опция если компилите чем то другим.
Видимо это только для Gulp, у себя не знаю где пристроить.
Почитал про атом, народ жаловался что нельзя из коробки компилить нормально, незнаю может пофиксили уже. Я на gulp сижу, мне вообще все равно какой там компилятор в редакторе, хоть каждую строчку в разных редакторах пиши.Это внешнее дополнение, другим дополнением LESS компилировал, без нареканий.
-
Компилирую через дополнение редактора Atom. По закрывающим тегам я имел ввиду, что в WP тег html открывается в файле header.php, а закрывается в footer.php. При написании через Jade написание тега предполагает его последующую компиляцию в закрытом виде.
-
Может быть min-height будет решением? Он не будет мешать последующим увеличениям высоты при растяжке.
-
Через jQuery просто сделать. При наведении анимировать высоту. Функция animate(). Если добавить jQuery UI, то можно и направление анимации менять.
Также можно зафиксировать верхнюю надпись и анимировать через CSS плавное появление нужного блока через opacity и transition.
-
Здравствуйте!
Начал осваивать шаблонизатор Jade и сейчас в рамках обучения переделываю свои WP-шаблоны (да, у меня на работе принимают проект только с натяжкой
).Есть такой код:
<!doctype html><html> <head> <meta charset="utf-8"> <?php wp_head(); ?>
Пишу его в Jade:
doctypehtml head meta( charset='utf-8' ) <?php wp_head(); ?>
На выходе получается:
<!DOCTYPE html><html> <head> <meta charset="utf-8"><?php wp_head(); ?> </head></html>
Возможно ли перенести PHP-вставку на новую строку с правильным отступом?
И в целом, есть ли смысл пробовать верстать шаблон с вставками через Jade, т.к. уже вижу проблему с закрывающими тегами. Или все-таки будет более правильным сначала верстать макет, а потом его натягивать на WP? На вскидку представляется, что это будет занимать больше времени, чем одновременная верстка+натяжка.
-
Может быть это не в Бутстрапе дело? Может быть это обычное поведение мобильного браузера для облегчения чтения текста? Просто не сталкивался с таким раньше...
-
Приношу извинения. Вот скриншот с реального устройства - https://yadi.sk/d/ZKo-UlQUh3KHB
В эмуляторе Хрома такое же поведение.
-
Здесь хорошо. Увеличенный шрифт в блоке "Программа", например.
-
Ссылка - http://goo.gl/Bm1RQV(логин: 1, пароль - 1).
-
Добрый день!
Есть табы, сделанные при помощи Bootstrap. Для текста внутри них задан фиксированный размер шрифта в пикселях. Верстка фиксированная, задан <meta name="viewport" content="width=1260">.
На обычных экранах все отображается корректно. На мобильных устройствах шрифт увеличивается, при этом никаких свойств в style не появляется, он просто становится больше. Консоль Хрома это подтверждает, но при этом сообщает что активно ранее заданное значение фиксированной ширины.
Подскажите, пожалуйста, можно ли это побороть? Каким образом Бутстрап меняет размер шрифта?
Скриншот c мобильного устройства - https://yadi.sk/d/ZKo-UlQUh3KHB
Ссылка - http://goo.gl/Bm1RQV (логин: 1, пароль - 1).
-
-
Спасибо за ответы. Классы наверно все-таки надо было упростить для наглядности примера.
Вы при клике не переопределяйте по 20 раз события наведения мыши и отведения, а 1 раз навешайте событие, в котором смотрите по переменной какая кнопка была нажата. А клик уже просто будет менять переменную со статусом и классы.Спасибо за совет. Попробую переделать, отпишусь в теме.
-
Как можно так именовать классы? Это же просто ужас!
Я неправильно использую именование по БЭМ или БЭМ в целом ужас?
-
Добрый вечер!
Есть простая задача: две кнопки сверху, к каждой привязано изображение. При клике по кнопкам изображение изменяется, также при наведении на каждое изображение происходит смена изображения в зависимости от того, на которое наведено.
Для наглядности код в JSFiddle - http://jsfiddle.net/yustnip/92wrmk85/1/
Теперь уже по коду в JSFiddle. Сначала при наведении на красный блок все хорошо, он изменяется на зеленый, но если кликнуть сначала на вторую кнопку и потом на обратно на первую, то красный блок начнет меняться на синий, что не нужно.
Это происходит потому что, несмотря на удаление через removeClass(), jQuery продолжает отслеживать класс 'b-main-infographics__slide--second' и добавляет класс 'b-main-infographics__slide--second-active' (синий).
Подскажите, пожалуйста, как правильно сделать, чтобы все-таки в указанном сценарии цвет в первом блоке при наведении менялся на зеленый?
-
Попробовал rotate с предварительным поворотом фона в графическом редакторе, не совсем получилось, с правой стороны ожидаемо осталось пустое место. Сделал через @media, для популярных разрешений свою картинку, а для совсем больших экранов обрезки не будет.
Раздвижной слайдер. Возможно ли сделать?
in HTML Coding
Posted
Все получилось, еще раз спасибо. Немного пришлось еще только сдвинуть внутренний блок влево, чтобы пустоту угла закрыть. jQuery так же отлично сработал на изменение ширины при наведении.