npofopr

Expert
  • Content count

    3,553
  • Joined

  • Last visited

  • Days Won

    82

Everything posted by npofopr

  1. Для 2013 года, норм) Сайт одной картинкой, всё по правилам веба)
  2. npofopr

    Адаптивная верстка

    viewbox может задан в метатегах? или у родителя ещё есть ограничение. Пользуйтесь DevTools, это облегчит вашу жизнь.
  3. Я лет 5 назад им пользовался. Оно ещё живое?) Аккуратнее с этим) * * jQuery carouFredSel 6.1.0 * Demo's and documentation: * caroufredsel.frebsite.nl * * Copyright (c) 2012 Fred Heusschen * www.frebsite.nl * * Dual licensed under the MIT and GPL licenses. * http://en.wikipedia.org/wiki/MIT_License * http://en.wikipedia.org/wiki/GNU_General_Public_License */
  4. Дак это не навигация в два ряда. Это обычные превью ссылки. thumb. По типу этого https://jsfiddle.net/keithpetrillo/6j7fzwek/ Обсуждения — https://stackoverflow.com/questions/39567327/how-to-create-thumbnail-carousel-with-image-previews-in-slick-js https://swiperjs.com/demos/ (https://swiperjs.com/demos/310-thumbs-gallery-loop.html) в этом плане мне больше нравится. Там синхронизация проще делается. Но и плагин тяжелее.
  5. Да! Спасибо! А почему так не срабатывает? cardWrap.onclick = function(event) { let target = event.target; while (target != this) { if (target.classList.contains("flip-card")) { if (target.classList.contains("is-flipped")) target.classList.remove("is-flipped"); target.querySelector(".friends-video").classList.remove("is-back"); target.querySelector(".friends-video__back > video").load(); target.querySelector(".friends-video__front > video").load(); else highlight(target); return; } target = target.parentNode; } }; Удалять класс он удаляет, а дальше target.querySelector(".friends-video").classList.remove("is-back"); target.querySelector(".friends-video__back > video").load(); target.querySelector(".friends-video__front > video").load(); уже нельзя получается? А нет. Добавил скобочки { } и теперь вроде всё как надо, надеюсь. if (target.classList.contains("is-flipped")) { target.classList.remove("is-flipped"); target.querySelector(".friends-video").classList.remove("is-back"); target.querySelector(".friends-video__back > video").load(); target.querySelector(".friends-video__front > video").load(); } else { highlight(target); } return; https://codepen.io/npofopr/pen/zYOmbPv
  6. как изолировать клик по 'button' и клик по 'cardBack'. Там получается, что клик по кнопке срабатывает также как клик по всей области. Читаю про 'e.preventDefault();' но пока не вник, куда его вставить. И как можно закрывать соседние плашки, когда на другую кликаю? https://codepen.io/npofopr/pen/zYOmbPv Видео не стопорится я понимаю почему, потому что первый элемент video и так не проигрывается. По всем тегам, я так понимаю, надо через `querySelectorAll` проходить? Изолировал e.stopPropagation();
  7. Да. Совершенно верно. Знать бы ещё как) По идее ваш вариант должен срабатывать, var list = document.querySelectorAll('.is-flipped') list.forEach(function(item) { item.classList.remove('is-flipped'); }); но он не обрабатывает этот клик. Или по идее, я могу накостылять клик на блок с видео, и у родителя удалять класс is-flipped. Правда тоже не факт, что сработает.
  8. Обновил https://codepen.io/npofopr/pen/zYOmbPv 🙂 Вроде даже и с видео разобрался. Воткнул правда две кнопки, одной кнопкой как сменять видео, пока не допёр. Осталось понять, как активную карточку закрывать по правильному, при клике на неё) Пробовал вместо while (target != this) сделать через for, но кроме ошибки это ничего не дало.
  9. Примерно так, да. Там при нажатии добавляется класс .is-flipped , и внутри получается есть ещё кнопка, которая меняет видео. Ну и да, при нажатии на соседнюю плитку, класс надо у соседней удалять. И видео стопорить. Попробую) Попробую на Jq переписать, что есть. Как то мне попроще пока будет.
  10. По изоляции да, подойдёт. Изоляцию я уже починил в примере. Теперь читаю/ разбираюсь как соседние элементы закрывать. Но от помощи не отказываюсь 😄
  11. Надо или живой пример или кофейную гущу разводить.
  12. Жуть жуткая. Раз уж хотите исправить проблему, начните с ликвидации span (зачем он там?) Он может перебивать вашу жирность. А strong оберните текст в ссылке, а не ссылку.
  13. Ну он и лезет, за границы вашего блока) Укажи вы значения в % всё стало бы чуть по-другому.
  14. Хм. А что он по вашему должен делать?
  15. Разработать и знать инструмент, немного разные вещи.
  16. Из онлайн инструментов, нравится — https://tinypng.com/ PS: Не стоит читать статьи 2013 года, тем более по оптимизации. Во всяком случае, лучше всегда искать, что по свежее.
  17. Можно ещё у дизайнера спросить, каким сайтом он вдохновился. Когда-то давно мне попадался дизайнерский сайт, с точно такими же линиями. Возможно и он с него идею взял)
  18. Обернуть заголовок ещё раз и для обёртки через те же :after :before добавить линии. на https://www.kizu.ru/ru/ в экспериментах была старая статья про эти линии. Но у меня провайдер не открывает. + на том же codepen масса вариантов.
  19. Может с clear путаете? Или в статье спутали. Наверно, древняя? http://htmlbook.ru/css/clear
  20. Надо не знать, надо пользоваться 🙂
  21. npofopr

    Помогите найти причину

    Я про Фотошоп) В последних версиях есть возможность копирования css. Очень помогает "вытащить" тени, те же размеры шрифтов, line-height и т.п. Перетаскивания шрифта никак не затронут его размеры. А про 400 и визуально, первый раз вижу) Больше похоже на "особенность" самого шрифта, что он так выглядит. Но и не отрицаю, что такое возможно)
  22. Выводить картинку через api, а не конструктором. Тогда можно будет задать координаты центровки.
  23. npofopr

    Помогите найти причину

    + в Фотошопе можно прямо css же скопировать. Чтобы сверить.