Эффект блика в предзагрузке на CSS

Если вы пользуетесь мобильными банковскими приложениями, приложениями маркетов и всяким подобным, наверняка видели такой эффект, когда данные еще не загрузились, а на экране уже отобразилась схематическая раскладка страницы с плейсхолдерами ее элементов. И для визуальной имитации, что приложение еще не окончательно зависло, по плейсхолдерам периодически пробегают анимированные блики. Я решил реализовать нечто подобное для web-страничек. За основу взят код из предыдущей статьи.

Читать статью целиком »

Вставка изображения из буфера обмена на JavaScript

В интернетах популярны различные хостинги картинок, на некоторых из них есть возможность вставки изображений из буфера обмена для последующей загрузки. Это весьма интересная и полезная функция, так что мне, естественно, стало любопытно, как это делается.

Читать статью целиком »

Прогрессбар с анимированным градиентом на CSS

Анимированный прогрессбар очень часто используется в приложениях для мобильных устройств. Но его также можно использовать и на сайтах, когда выполняется какой-то длительный процесс и надо создать у пользователя иллюзию, что приложение не зависло и что-то происходит прямо сейчас. Для анимации обычно применяется бегущий градиентный фон. Сегодня сделаем такой градиентный прогрессбар на чистом CSS, а "оживим" его с помощью JavaScript.

Читать статью целиком »

Отправка сообщений через API PROSTOR-SMS на PHP

При возникновении какой-либо чрезвычайной ситуации очень важно, чтобы были своевременно оповещены все ответственные лица. У нас это делается при помощи бота в Telegram, но в роли дополнительного канала используются старые добрые SMS-сообщения. В качестве шлюза для отправки SMS мы уже давно выбрали PROSTOR-SMS. Это не реклама, сервис платный и ни разу не дешевый, но мне с этой статьи ни копейки не капает.

Для взаимодействия с внешними приложениями у сервиса есть несколько интерфейсов API, в том числе REST. Готового официального кода для взаимодействия с API не было, а примеры, мягко говоря, оставляют желать лучшего. Поэтому пришлось рисовать свой вариант. Может быть пригодится кому-нибудь еще.

Читать статью целиком »

Групповой выбор checkbox'ов на JavaScript

В некоторых пользовательских интерфейсах в рабочих проектах приходится сталкиваться с длинными таблицами. Одна из колонок в такой таблице - чекбокс, которым отмечаются строки, с которыми надо выполнить то или иное действие. При выборе пары-тройки чекбоксов проблем не возникает, один клик - один чекбокс. В шапке колонки есть мастер-чекбокс, с помощью которого можно отметить все или снять все галочки. А вот при необходимости отметить не все, но просто большое количество чекбоксов начинаются сложности. По одному делать это долго. Но ведь даже в стандартном Проводнике есть возможность выбирать последовательность файлов, отмечая чекбоксы с зажатой клавишей Shift. Такая идея мне понравилась и я перенес ее на веб-страницы.

Читать статью целиком »