
Schamil74
User-
Posts
116 -
Joined
-
Last visited
-
Days Won
8
Content Type
Profiles
Forums
Calendar
Store
Everything posted by Schamil74
-
Всем привет! Наткнулся на такой макет https://mega.nz/#!5XYwxYrK!CKPEpk5YklPP-_QThH67BoTQLVQfDvzt1cmVoO9hFRo На картинке проблемные элементы выделены синими стрелками: - листы с загнутыми уголками и тенями (Блоки с заголовками Documents и Photos) - иконки планшетов с тенями - линия разрыва (если так понятно о чем я) - иконки ноутбука с тенями Можно сверстать так: загнутые листы и иконки блоков docs и photos наверное можно в одну png сохранить. можно разбить на два файла. Планшеты(ноут) и тени сделать отдельными картинками. Т.е. тень будет фоном у компа и ноутов. Планшеты и ноут в SVG. Но больше всего интересна полоса разрыва))))Как? Просто взять и наложить фоном в виде картинки? А как бы вы сверстали эти элементы? Какое решение будет оптимальным?
-
Всем привет! Занимаюсь версткой 3,5 месяца, без наставника, просто просматривая обучающие ролики и читая источники по этой теме. На данный момент сверстал 7 макетов: 2 фикс, 2 на бутстрап, 1 адаптивный без фреймворка, 1 резиновый-адаптивный без фреймфорка и последний с анимированным скроллингом, адаптивный, резиновый, под ретину https://schamil74.github.io/Mogo/
- 7 replies
-
- лендинг
- анимированный скроллинг
-
(and 1 more)
Tagged with:
-
поочередное отображение иконки в раскрывающемся диве
Schamil74 replied to Schamil74's question in JavaScript
Спасибо. Дело в том, что я с js на вы. Хотел реализовать такую обычную идею как предлагаете вы, увы не вышло. Вышел из положения через jquery.accordion, наткнулся случайно при поиске решений -
Всем привет! Подскажите с задачей! Как сделать нормальную работу стрелок? При втором цикле кликанья нормально работает только третий элемент. Здесь можно экспериментировать
-
Оцените верстку: резиновая, адаптивная + retina
Schamil74 replied to Schamil74's topic in Discussion of works
своровали а в целом как верстка?))) -
а если с сылкой поиграть? оставить только /check_param.php или убрать http? если ссылка внутренняя конечно)))
-
Выравнивание блоков по центру используя свойство: text-align
Schamil74 replied to greenrow's question in HTML Coding
Только хотел предложить. Как вариант -
Всем привет! Занимаюсь версткой 3 месяца, без наставника, просто просматривая обучающие ролики и читая источники по этой теме. На данный момент сверстал 6 макетов: 2 фикс, 2 на бутстрап, 1 адаптивный без фреймворка и 1 резиновый-адаптивный без фреймфорка. Выкладываю последний. Всю сложность можно оценить путем изменения области просмотра браузера, как ведут себя элементы на разных брейкпоинтах. Все иконки svg-спрайты (с ними помучился). В этой верстке немного пытался реализовать именования классов по БЭМ. Немного парился с кроссбраузерностью. Не тестировал на ie9 и ниже, такой задачи не было. https://schamil74.github.io/Mishka/
-
Разобрался! Дело в том, что нужно было удалить содержание тега <g>, а именно атрибуты transform.
-
В продолжение Ссылку на сайт я давал. Не пойму, почему топик так отображается неверно. Сравните их. Который свежее более полный. Через инспектор не умею это смотреть. Да, какая-то ошибка была. Эту тему можно удалить.
-
Вы меня простите, но видимо что-то пошло не так! Я тему не дублировал. Может на моей стороне баг какой-то или руки-крюки. Предыдущую тему можно удалить. Данная тема с полным описанием проблемы и здесь есть ссылка на сайт.
- 2 replies
-
- svg-sprite
- ie11
-
(and 1 more)
Tagged with:
-
Всем привет! Столкнулся проблемой отображения svg спрайтов в ie11. Описываю проделанные мною два варианта: В 1ом варианте svg экспортировал через плагин generate в photoshop 2015. Работает во всех браузерах, но не реагирует на css, даже если почистить все атрибуты у svg. Во 2ом сложнее сохранял как .ai и конвертировал в svg. Не работает только в ie11 (версии ниже не проверял, но это и не нужно), но реагирует на css, причем не отображаются только некоторые иконки. Спрайт прикрепляю сразу после открывающего тэга body и скрываю его. Обращаюсь к спрайту через, например (синтаксис pug: svg.contacts__flag(width="60", height="90") use(xlink:href="#flag") Ниже сама верстка со спрайтом только 2го варианта https://schamil74.github.io/Mishka Таск для спрайтов gulp.task('symbols', function () { return gulp.src("source/img/icons/*.svg") .pipe(svgmin()) .pipe(cheerio({ run: function ($) { $('[fill]').removeAttr('fill'); $('[stroke]').removeAttr('stroke'); $('[style]').removeAttr('style'); }, parserOptions: {xmlMode: true} })) .pipe(replace('>', '>')) .pipe(svgstore({ inlineSvg: true })) .pipe(rename("symbols.pug")) .pipe(gulp.dest("templates/blocks/")); }); Скрин того, что видит chrome и firefox (слева), и ie11 (справа). Повторюсь, что не все иконки не отображаются Пробовал подключать svgxuse и svg4everybody, но толку нет. Какую еще предоставить инфу? PS: Я все еще новичок.
- 2 replies
-
- svg-sprite
- ie11
-
(and 1 more)
Tagged with:
-
Всем привет! Столкнулся проблемой отображения svg спрайтов в ie11. Есть два варианта: В 1ом варианте svg экспортировал через плагин generate в photoshop 2015. Hаботает во всех браузерах, но не реагирует на css, даже если почистить все атрибуты у svg. Во 2ом сложнее сохранял как .ai и конвертировал в svg. Не работает только в ie11 (версии ниже не проверял), но реагирует на css, причем не отображаются только некоторые иконки. Спрайт прикрепляю сразу после открывающего тэга body и скрываю его. Обращаюсь к спрайту через, например: svg.contacts__flag(width="60", height="90") use(xlink:href="#flag")
-
/
-
Всем привет! Занимаюсь версткой чуть больше 2ух месяцев, без наставника, просто просматривая обучающие ролики и читая источники по этой теме. На данный момент сверстал 2 фикс макета и один адаптив, ссылку на который сейчас и выкладываю. Так же адаптирован под ретина дисплеи. https://schamil74.github.io/Sedona2017/ Заходите с телефонов, планшетов. А вот касательно кроссбраузерности, обнаружил такой баг: На IE11 иконки выпадают из инпута. Пока не могу загрузить скрин - ошибка!!!
-
- адаптивный
- mobile first
-
(and 2 more)
Tagged with:
-
Саня, спасибо! Вот не люблю я эти таблицы))))
-
Всем привет! Сейчас делаю разметку блока для мобильной версии и не могу выровнять (растянуть) инпут как на макете. Код блока такой https://codepen.io/Schamil74/pen/GWQLbQ Отрывоке макета приложил. Здесь нужен вариант выравнивания инпутов, типо margin-right: 0. А вот как их растянуть до текста не догоняю))))
-
Поторопился! В общем запустил я сс2014 и 2015, но экспорт не работает (висит).
-
виртуалка неочень - пробовал. у меня стоял cs6, но там не было generate, а он так нужен. тему можно закрывать. сутки мучился, написал тему и все получилось;)
-
отличный мотиватор про Винду)))) фотошоп покорился))) так и не понял, что сделал
-
Всем привет! Помогите установить Photoshop СС 2014 на linux mint x64. Я уже за***лся, не получается!
-
Реально за месяц! Главное разработать для себя план обучения и не лениться. Это макет я верстал уже с препроцесором Sass, используя сборщик gulp, немного нативный js, изучал параллельно с версткой. Ну и мелочи всякие. Сверстал два фикс макета. Сейчас изучаю БЭМ и адаптив с резиной. На данный момент сделал тольку разметку главной страницу с адаптивом на флоатах, mobile first. Но этот макет я уже верстаю с помощью постпроцессора PostCSS с использованием синтаксиса SCSS. Вот оцените первые шаги с БЭМ и адаптивом. Сделал только адаптивную разметку!!! https://schamil74.github.io/Sedona2017/ Кстати, спасибо за ссылочку
-
так и должно быть
-
Немного подправил. С 0,5сек до 0,2сек
-
Так и думал, что спецсивол не нужно было прописывать Подправил!