• Есть ли лучший вариант чем использование href="tel:…"?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Если вы напишете просто телефон текстом, и поставите
    <meta name="format-detection" content="telephone=yes"/>
    , то iOs автоматически обернет его в тег <a>, тем самым модифицировав ваш код.
    Правильно и семантично будет понять, чем же не устраивает ссылка для телефона. И разобраться в той причине, по которой вы хотите избавиться от нее.

    Если же ваша задача - оптимизировать, то убирая ссылку, вы делаете только хуже. Есть определенные стандарты и поведения браузеров, следуйте им.

    P.S.: Чтобы сделать кликабельным элемент не-ссылку и не-кнопку на iOs, нужно добавить к нему curpor: pointer;
    Ответ написан
    3 комментария
  • Как навесить обработчики событий на вставляемый html-код?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Вопрос детский, но я сам так же тупил вначале.
    Вам нужно делегирование событий. Вешаете обработчик не на кнопки, а на родительский тег кнопок. Хоть на <body>. Конечно, вешать на самый корень плохо, по причинам производительности и разграничения кода. Но вешать на тег-родитель, скажем, ленты новостей - дело благое.
    Синтаксис на jQuery выглядит так:
    $('ul.news-list').on('click',' div > a.button', function() {
    // 
    });
    Ответ написан
    2 комментария
  • Можно ли сохранять на сервере изображения без расширения?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Есть проблема. Если хранить без расширения и без MIME-типа, то могут быть проблемы при копировании файлов с windows на linux и обратно, т.к. некоторые файловые менеджеры могут воспринимать файлы по особому и менять некоторые байты для совместимости между win/lin. И это может выйти боком и файлы станут битыми, если не копировать их бинарным методом.
    С этим сталкивались на практике. На linux-сервере было все нормально (php скрипт добавлял header'ы к файлам), скопировали filezill'ой на винду, на ней запустили тот же php скрипт, а файлы (исходные, обрезанные) отличаются в несколько байт (в зависимости от типа файла).
    Ответ написан
    Комментировать
  • Как в Wordpress выключить удаление тега form?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Другой тег <form>, который, по всей видимости, у вас выше стоит по иерархии.
    Тег <form> нельзя вкладывать внутрь себя же.
    Вот это:
    <form name="FORM_ONE">
        <input type="text" name="one">
        <form name="FORM_TWO">
            <input type="text" name="two">
        </form>
    </form>

    Превратится браузером вот в это:
    <form name="FORM_ONE">
        <input type="text" name="one">
        <input type="text" name="two">
    </form>
    Ответ написан
    Комментировать
  • Как сделать чтобы CSS3 свойства поддерживались и на IE 8?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Пользовался css3pie.com, жутко глючная вещь. Сейчас, спустя несколько лет, возможно что-то поменялось. Но на тот момент даже на моем быстром по тем временам компьютере все подтормаживало. А компьютеры со старыми IE в среднем медленнее тех, где стоят современные браузеры (или IE10-11).

    Поэтому не советую cssPie использовать, так как помимо производительности, оно иногда криво применяется, а уж о точности теней 1 к 1 и говорить не стоит.

    Поэтому, предлагаю воспользоваться методикой Graceful Degradation — всегда можно сделать красивый и понятный дизайн без тенюшек и без закруглений. Главное — чтобы верстка не плыла.
    Ответ написан
    Комментировать
  • Как сделать блоки одинаковой высоты (Только совет, не задача)?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Нужно использовать свойство vertical-align: top; // или bottom, а по умолчанию блоки выравниваются по baseline
    Ответ написан
    Комментировать
  • Как разрабатываются такие сайты?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Опыт создания подобных штук есть. Это очень геморройно. Таких работ мало, так как тут нужен не простой дизайнер и не простой верстальщик, и даже не простой front-end'er, а все вместе: программист js-ер, умеющий толково верстать, при этом, прочитавший немало книг по дизайну.
    Не думаю, что под данную достаточно специфичную задачу есть фреймворк.
    UPD. Продублирую ответ из комментариев:
    специфично здесь следующее: когда вы начнете делать такой сайт, вы столкнетесь с кучей проблем уровня js, верстки и дизайна. Сначала вы будете тупить над версткой и css, потом над тем, чтобы ваш js-код был читабельным, затем над тем, чтобы все это дело подгонять, потому что с первого и десятого раза у вас получится некрасивая херня. Придется менять js-код и верстку по 10 раз, и, если вы не имеете достаточного опыта в том и в другом, у вас получится страшный код, 100500 итераций переделки и огромное число человеко-часов.
    Это просто так кажется, что вот тут полоска, тут полоска, го анимировать. Это же все надо продумать, скреативить, затем подгонять параметры анимации и прочего.
    Либо трех людей (js-программист, верстальщик, дизайнер) запереть в одной комнате и привязать цепью =)
    Ответ написан
    9 комментариев
  • Как сверстать такие иконки?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Нужно использовать svg объекты. path, polygon.
    Средствами css пока не сделать, чтобы адекватно работало:
    htmlbook.ru/blog/maskirovanie-v-css
    Ответ написан
    Комментировать
  • Как присвоить несколько ID?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Самым простым решением является добавление класса, например myTab к каждому табу, $('.myTab').css(). Точно так же, удобнее с точки зрения разработки воспользоваться атрибутами, отказавшись от id.
    <a class="myTab" data-id="1"></a><a class="myTab" data-id="2"></a>

    Производительность селектора # многократно выше селектора атрибутов, но при использовании в контексте табов, которых не может быть очень много -- совершенно не существенна.
    Ответ написан
    Комментировать
  • Почему div обтекает span неравномерно?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Желательно так же указывать значение Line-height, тогда проблемы не будет https://jsfiddle.net/w12fugqy/1/
    Ответ написан
    Комментировать
  • Как сделать такое закругление рамки, в обратном направлении?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Можно решить дело псевдоэлементом, который бы имел правый-верхний закругленный угол, был бы поверх основного div'а, у которого было бы только нижнее скругление.
    Ответ написан
    Комментировать
  • Что значит "вэб-технолог"?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Не согласен с предыдущей (первой по времени) веткой комментариев.
    Данное понятие стоит разбить по составляющим:
    1. Веб
    2. Технолог

    Согласно википедии, технолог, или инженер-технолог:
    инженер, занимающийся разработкой, организацией того или иного производственного процесса. Также может разрабатывать какую-то определенную технологию.

    Важная составляющая - это производственный процесс. В контексте веба - это сайтостроение или создание частей сайта. В отличие от программиста или дизайнера, веб-технолог больше исполнитель, нежели созидатель. Ему ставится задача, и он ее выполняет. Технолог решает задачу, а не ставит ее. Как верстальщик. Верстальщик в полиграфии тоже не придумывает, он выполняет задачу.
    А вот программист, дизайнер могут создавать новое. Часть которого он может делегировать технологу. Чтобы последний, в результате, нашел способ это реализовать.
    Ответ написан
    2 комментария
  • Как реализовать график средствами table?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    1. Находим минимальный вертикальный интервал, например, 15 минут
    2. Создаем столько <tr>, сколько у нас этих интервалов, (24*(60/15))=96
    3. Затем проставляем rowspan, удаляем лишние ячейки
    Ответ написан
  • Возможно ли с помощью CSS сделать плавно выдвигающийся заголовок, при открытии страницы?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    1. Добавьте в css нужный класс с описанием анимации
    2. В html его не вставляйте
    3. С помощью скрипта добавьте класс к нужному тегу
    4. ???
    5. При добавлении класса к элементу, анимация тут же применится

    Как сделать на javascript код? (вариант попроще, для новичка)
    1. Создаем функцию добавления класса к элементу по его идентификатору
      function setClassForAnimation() {
        var header = document.getElementById('idOfHeader');
        header.classList.add('animate')
      }

    2. Отслеживаем загрузку html-дерева с помощью события onload, где вызываем нашу функцию <body onload="setClassForAnimation()">
    Ответ написан
    3 комментария
  • Какой самый максимальный размер экрана телефона?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Для адекватной работы сайта вам нужно определить следующие параметры:
    1) есть ли в устройстве тач-ввод (для определения минимального размера активного элемента, и когда нужно включать/отключать hover-поведение)
    2) какое dpi(ppi) у устройства (можно определять с помощью media)
    3) какое разрешение вьюпорта у устройства. Может быть и 4к-дисплей, а вьюпорт разработчиком будет задан как 384px на 968px

    И самое главное: в адаптивном дизайне не важно устройство, важно подстраивать дизайн под тип ввода (тач - мышка) и под вьюпорт. Представляйте клиента не как телефон/планшет/ноутбук, а как растягивающийся экран от 4 до 27 дюймов. Меньше 4 - уже совсем другой UI (часы всякие), больше 27 - уже пошли телевизоры, тоже со своими причудами. Там и возможности браузера ограничены и тип ввода другой - 3d-мышка или magic-mouse
    Ответ написан
    Комментировать
  • Адаптивный Резиновый Кроссбраузерный CSS дизайн на FLEX. Почему Chrome отображает не правильно?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Ну уезжает футер ровно на высоту header, кажется, надо от этого "плясать"
    Ответ написан
    Комментировать
  • Wordpress дублирование товара в корзине, как решить?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    Без реального примера ничего не скажешь. Телепаты на каникулах. Но, если подумать, возможно, обработчик добавления товара в корзину вешается не только на кнопку "Добавить в корзину", но и на другие ссылки. Возможно, тег <a> не закрыт.
    Ответ написан
  • Как добавить иконку и фон в закладки?

    Carduelis
    @Carduelis
    Web-developer, front-end, js, less
    А у вас указаны meta-теги для цвета топ-бара в ios, Android, цвет плитки для Windows? На месте разработчиков Яндекса, я бы брал это за основу + web-app иконка
    Ответ написан
  • Есть ли в сети стили для MS Word по ГОСТу (например, для написания Диплома)?

    Carduelis
    @Carduelis Автор вопроса
    Web-developer, front-end, js, less
    Нашел стиль библиографии под ГОСТ. Это важнее просто стилей заголовков, так как настроить правильные ссылки в квадратных скобках на список литературы, сам порядок этого списка и порядок слов в элементе списка через стандартные средства word нельзя, и нужно пилить xml-файл с многотысячным количеством строк.
    https://github.com/irandom/docs/tree/master/gost-r...
    Ответ написан
    Комментировать