Jump to content

yustnip

User
  • Posts

    30
  • Joined

  • Last visited

Everything posted by yustnip

  1. Все получилось, еще раз спасибо. Немного пришлось еще только сдвинуть внутренний блок влево, чтобы пустоту угла закрыть. jQuery так же отлично сработал на изменение ширины при наведении.
  2. Спасибо за ответ. Я и планировал так сделать, но повторюсь, что при уменьшении ширины косые линии становятся прямыми и получается ужас. Ширина режется с края (где косая линия). Смотрел в сторону трансформации skew, но, насколько я знаю, она деформирует содержимое для искривления. Плюс предполагаю еще возможную проблему с обработкой события наведения, т.к. прозрачность под косыми линиями будет наезжать на другие блоки и не срабатывать на нижних слоях. В общем беда с этим слайдером.
  3. Здравствуйте! Есть задача сделать вот такой слайдер - https://yadi.sk/i/v6QfPqsxjcNdM (при наведении на каждый из трех кусочков изображений, соответствующее изображение должно появляться полностью, как бы раздвигаясь, уменьшая-сдвигая остальные). Все было бы хорошо если бы не диагональная обрезка изображений, т.е. при уменьшении ширины изображения диагональный край обрезается и становится обычным. Насколько возможно/сложно сделать такой слайдер? Буду очень признателен за наводку в какую сторону смотреть, чтобы такое реализовать.
  4. Осилил Gulp, очень крутая штука оказалась. Прикрутил Stylus, Jade PHP со шлифовкой gulp-html-prettify. В Атоме хоткей на сборку настроил и красота. Еще бы Jade PHP работал согласно документации, было бы совсем супер, ни в какую блоки PHP-вставки не генерирует целиком.
  5. Посмотрел, понял, что еще рано. Сначала надо до сборщиков морально прийти, хотя бы понять зачем и как.
  6. Ох, загуглил, нашлись только препроцессоры для станков с ЧПУ.
  7. Еще и нахваливают и в требованиях в вакансиях указывают. Мне после LESS идея на препроцессорах писать понравилась, вложенность ну очень рулит.
  8. Кстати, сейчас зашел на страничку дополнения и там есть опция pretty - https://atom.io/packages/jade-autocompile, по умолчанию вроде включено. Хотя может не работать конечно корректно. Получилось! Вот такая конструкция дала правильный отступ: doctypehtml head meta( charset='utf-8' ) | | <?php wp_head(); ?>
  9. Понятно, спасибо за ответы.
  10. Видимо это только для Gulp, у себя не знаю где пристроить. Это внешнее дополнение, другим дополнением LESS компилировал, без нареканий.
  11. Компилирую через дополнение редактора Atom. По закрывающим тегам я имел ввиду, что в WP тег html открывается в файле header.php, а закрывается в footer.php. При написании через Jade написание тега предполагает его последующую компиляцию в закрытом виде.
  12. Может быть min-height будет решением? Он не будет мешать последующим увеличениям высоты при растяжке.
  13. Через jQuery просто сделать. При наведении анимировать высоту. Функция animate(). Если добавить jQuery UI, то можно и направление анимации менять. Также можно зафиксировать верхнюю надпись и анимировать через CSS плавное появление нужного блока через opacity и transition.
  14. Здравствуйте! Начал осваивать шаблонизатор 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? На вскидку представляется, что это будет занимать больше времени, чем одновременная верстка+натяжка.
  15. Может быть это не в Бутстрапе дело? Может быть это обычное поведение мобильного браузера для облегчения чтения текста? Просто не сталкивался с таким раньше...
  16. Приношу извинения. Вот скриншот с реального устройства - https://yadi.sk/d/ZKo-UlQUh3KHB В эмуляторе Хрома такое же поведение.
  17. Здесь хорошо. Увеличенный шрифт в блоке "Программа", например.
  18. Добрый день! Есть табы, сделанные при помощи Bootstrap. Для текста внутри них задан фиксированный размер шрифта в пикселях. Верстка фиксированная, задан <meta name="viewport" content="width=1260">. На обычных экранах все отображается корректно. На мобильных устройствах шрифт увеличивается, при этом никаких свойств в style не появляется, он просто становится больше. Консоль Хрома это подтверждает, но при этом сообщает что активно ранее заданное значение фиксированной ширины. Подскажите, пожалуйста, можно ли это побороть? Каким образом Бутстрап меняет размер шрифта? Скриншот c мобильного устройства - https://yadi.sk/d/ZKo-UlQUh3KHB Ссылка - http://goo.gl/Bm1RQV (логин: 1, пароль - 1).
  19. Уф, получилось - http://jsfiddle.net/yustnip/8cp4vnm5/2/ Полагаю, спасла функция unbind().
  20. Спасибо за ответы. Классы наверно все-таки надо было упростить для наглядности примера. Спасибо за совет. Попробую переделать, отпишусь в теме.
  21. Я неправильно использую именование по БЭМ или БЭМ в целом ужас?
  22. Добрый вечер! Есть простая задача: две кнопки сверху, к каждой привязано изображение. При клике по кнопкам изображение изменяется, также при наведении на каждое изображение происходит смена изображения в зависимости от того, на которое наведено. Для наглядности код в JSFiddle - http://jsfiddle.net/yustnip/92wrmk85/1/ Теперь уже по коду в JSFiddle. Сначала при наведении на красный блок все хорошо, он изменяется на зеленый, но если кликнуть сначала на вторую кнопку и потом на обратно на первую, то красный блок начнет меняться на синий, что не нужно. Это происходит потому что, несмотря на удаление через removeClass(), jQuery продолжает отслеживать класс 'b-main-infographics__slide--second' и добавляет класс 'b-main-infographics__slide--second-active' (синий). Подскажите, пожалуйста, как правильно сделать, чтобы все-таки в указанном сценарии цвет в первом блоке при наведении менялся на зеленый?
  23. Попробовал rotate с предварительным поворотом фона в графическом редакторе, не совсем получилось, с правой стороны ожидаемо осталось пустое место. Сделал через @media, для популярных разрешений свою картинку, а для совсем больших экранов обрезки не будет.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy