Рубрика: html

  • Javascript. jQuery. Как подключить css-файл (аналог $.getScript)

    Подключать внешний css-файл через javascript (jQuery) — задача нечастая, но вероятная. В этой статье пример простого решения задачи. Итак, Вашему вниманию два варианта решения задачи. jQuery: $(», { rel: ‘stylesheet’, type: ‘text/css’, href: ‘path_to_the.css’ }).appendTo(‘head’); JavaScript: var linkElem = document.createElement(‘link’); document.getElementsByTagName(‘head’)[0].appendChild(linkElem); linkElem.rel = ‘stylesheet’; linkElem.type = ‘text/css’; linkElem.href = ‘path_to_the.css’; Вот, в зависимости от Ваших […]

  • Как сделать ссылку на Скайп в HTML?

    Удобство пользователя на первом месте — поэтому иногда нужно вставить прямую ссылку на диалог в Скайпе. В этой статье расскажу, как можно это сделать. Итак, рассмотрим несколько примеров. Простая ссылка (без действий над профилем): Skype_User Ссылка на Звонок в Скайп или указанный телефонный номер: Skype_User +12345678 Ссылка на конференц-связь (логины через запятую): Skype_User Добавление Контакта […]

  • jQuery. Как обновить изображение в image?

    Иногда бывает надо обновить изображение в теге img при помощи jquery. В этой статье пример, как можно сделать refresh для img. Главное, что нужно знать — это то, что браузер кеширует изображения, что как раз и может мешать обновлению его на странице, если, к примеру, оно уже изменилось на сервере. В таком случае можно обновить […]

  • Html. Css. Стилизация кнопки input type=»file»?

    Нативный элемент загрузки файла в Html выглядит, мягко говоря, не очень хорошо — поэтому в этой короткой статье я приведу пример, как при помощи css стилизировать кнопку input type=file. Итак, решение включает две части — Html и CSS. Html. Оберните input в тег label: Custom Upload Также можно вынести элемент формы за предел : Custom […]

  • Javascript. jQuery. Как остановить видео в iframe?

    В случае, когда видео, к примеру youtube, выводится в модальном окне или слайдере часта ситуация, когда пользователь скрыл окно, но при этом воспроизведение видео не остановилось и играет в фоне. Пример простого решения проблемы Вы найдете в этой статье. К примеру, у вас есть модальное окно с iframe, в котором играет видео с youtube: Посмотри […]

  • Html. iOS Safari не работает аттрибут maxlength

    Не будем говорить о том, как можно игнорировать нативный html-аттрибут — просто разберем пример, как решить проблему. Решение очень простое, но, тем не менее, не уменьшает удивление от поведения Safari. $(‘input[name=»securitycode»]’).keypress(function() { if (this.value.length >= 4) { return false; } }); Данный простой код не даёт ввести в поле более, чем 4 символа. Ничего нового, […]

  • Bootstrap. Как сделать боковое всплывающее окно (sidebar modal)?

    В различных дизайнах и интерфейсах иногда уместно сделать модальное окно на всю высоту и прижатым к одной стороне. В статье — пример реализации этой идеи. По большому счету всё достаточно просто: К обычной разметке модального окна следует добавить новые классы left или right соответственно. Html: × Левый сайдбар Контент × Правый сайдбар Контент Также нужно […]

  • jQuery. Как запретить контекстное меню (правую кнопку мыши) на изображениях?

    На некоторых сайтах от пользователей нужно скрыть возможность сохранения изображений. Конечно, от знающих людей это не скроешь — но от тех, кто не силён — вполне запросто можно. В статье — пример реализации на три строки. Всё, что Вам нужно — подключить сам jQuery и вставить следующий код: $(‘img’).bind(‘contextmenu’, function(e) { return false; }); При […]

  • jQuery. Как обернуть элемент в тег?

    Необходимость обернуть элемент в другой элемент не редкость, поэтому jQuery, конечно же, предлагает простой вариант реализации задачи. Для этого следует использовать метод wrap. При этом у метода есть два варианта. Первый предполагает передачу в качестве параметра строки — тега, в который нужно облачить блок. Например: $(‘#some-div’).wrap(»); Приведенный код обернет #some-div в div.wrapper-for-some-div. Второй — даёт […]

  • Css. Как отцентровать по вертикали блок внутри абсолютно-позиционированного блока?

    Вопрос вертикального выравнивания в CSS часто вызывает проблемы. Особенно они актуальны при необходимости выровнять блок внутри абсолютно-позиционированного блока. Но есть простое решение, о котором сейчас и пойдет речь. Итак, решение достатоно простое, но не очевидное. Итак. CSS: .valign { position: relative; top: 50%; transform: translateY(-50%); /* vendor prefixes omitted due to brevity */ } HTML: […]