Рубрика «jquery» - 4

Анонимный разработчик написал статью для «Нетологии» о том, кто такие программисты, как ими становятся, и почему все программисты попадают в свой собственный Таиланд. При условии, если они пишут читабельный код, конечно же.

image

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

image

Речь пойдет об очередном решении многолетней проблемы в браузере — ограничение пользовательского ввода, или просто — маска, которая используется повсеместно: номера телефонов, кредитных карт, паспорта и т.д.

На данный момент было найдено два популярных решения:

  1. jQuery.Inputmask
  2. jQuery-Mask-Plugin

Те, кто пытался использовать маски в своих и без того непростых проектах, скорее всего были бы рады выбросить все это дело и использовать просто валидацию. Особенно если маска должна быть динамической, зависеть от уже введенных символов, нужна возможность получать размаскированное значение даже если пользователь ввел его не целиком, или нужно полностью скрыть placeholder… Что работало в одной библиотеке — не работало в другой, как только извращаться не приходилось. Уж проще самому написать, в конце то концов, программисты мы или кто!? Да и коллеги тоже не потерялись, написали под Android же.

Кому не терпится, вот оно: imaskjs.
Поломать демку можно здесь.
Читать полностью »

Так получилось, что я на своих сайтах использую плагин uploadify для jQuery — uploadify.com (хоть он уже устарел, флеш и все такое, но HTML5-версия у них уже платная). Плагин предоставляет мультизагрузку файлов, не перегружая страницу, что нам всем и надо. Однако оказалось, что в этом плагине не работает (и/или работает не так, как надо) функция проверки существования файлов перед отправкой на сервер.
Читать полностью »

Доброго времени суток, мой дорогой друг. В сети, да и на Хабре, есть множество статей на тему создания своего input type=«file», но все они отличаются большим количеством костылей и большим количеством кода, что, как мне кажется, не есть хорошо. Ибо, как бы это не было парадоксально, меньше — лучше.

Пишем самый простой и быстрый input type file - 1
Читать полностью »

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

В виртуальном пространстве Интернета, на мой взгляд, всегда удобно иметь в своем распоряжении привычный рабочий стол, который сосредоточил бы в себе все необходимые для пользователя приложения и позволил работать с данными непосредственно в браузере. На сегодня Интернет – это одна из бурно развивающихся отраслей IT-сферы и в последнее время особую популярность приобрели облачные технологии, в частности все больший интерес получают так называемые «онлайн операционные системы».

Система веб-рабочих стола организует для пользователя набор приложений и сервисов прямо в Интернете, доступный в любом месте и на любом устройстве. Основой каждого такого рабочего стола является интерфейс — аналог проводника и рабочего стола обычной операционной системы (Windows, Mac OS, Linux).
Читать полностью »

Для начала необходимо создать html разметку под слайдер.

#content — имитация блока на сайте, внутрь которого мы будем помещать сам слайдер.
#slider -блок самого слайдера
.left,.right — кнопки управления
.images — блок с картинками
.pict — дивы, которые оборачивают изображения

    <div id="content">
        <div id = "slider">
            <div class="left"><img src="images/arrow.png"></div>
            <div class="right"><img src="images/arrow.png"></div>
                <div class="images">
                    <div class="pict"><img src="images/1.jpg"></div>
                    <div class="pict"><img src="images/2.jpg"></div>
                    <div class="pict"><img src="images/3.jpg"></div>
                </div>
        </div>
    </div>

Далее css, в нем нет ничего сложного. Все изображения получают float:left, #slider получает позиционирование relative, чтобы кнопки управления можно было выровнять с помощью absolute. Правая кнопка поворачивается на 180 градусов, чтобы не пришлось использовать еще одну картинку стрелки.
Читать полностью »

Рецепт разработки бота под Telegram - 1

Добрый день, уважаемые читатели!

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

Статья может быть интересна как новичкам в программировании — увидеть, сколько препятствий стоят на пути у готового продукта, так и более продвинутым специалистам — где-то посмеяться, где-то поплакать, где-то написать комментарий «жизненно».

Преамбула

И так, что же может сделать один программист за 4 дня?
Читать полностью »

image
Эта статья о том, как написать универсальный JavaScript-компонент, который можно будет использовать

  • как React-компонент;
  • как Preact-компонент;
  • как Angular-компонент;
  • как Web Component;
  • как jQuery функцию для рендеринга в DOMElement;
  • как нативную функцию для рендеринга в DOMElement.

Зачем и кому это нужно

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

Читать полностью »

Данный текст является переводом ответа Кристиана Ристовски на статью «Как оно учить JavaScript в 2016»

Мне нужно создать страницу, которая отображает последние действия со стороны пользователей, так что мне просто нужно получить данные от REST и отобразить их в какой-то фильтруемой таблице, ну и обновлять её, если что-то изменится на сервере. Я думал, может быть, использовать JQuery для извлечения и отображения данных?

Читать полностью »

Hello, jQuery, again! Посвящено тем сенсорным сингл тач экранам, которые еще не канули в лету и поддерживают события mouseDown и иже с ними. Именно таким оказался информационный терминал, на котором нужно было демонстрировать контент сайта.

Задача данного плагина — скроллинг контента посредством касания одним пальцем на сингл тач сенсорном экране.

Используемые событияmouseDown/Move/Out. По умолчанию эта цепочка событий выделяет содержимое в пределах касания.

Реализация — до боли знакомое overflow:hidden, обертывание содержимого элемента и перемещение контента внутри.

Нерешенные проблемы — иногда, на грани между пересечением нижнего края и пятикратным замедлением, контент сдвигается вверх на определенный интервал. Примечательно, что при обратном движении (в момент пересечения этой черты) контент возвращается на свое место (сдвигается вниз).

Надеюсь, для кого-нибудь эта статья окажется полезной и найдет своё применение.
Вэлком в комментарии, жду ваши мысли, ваш конструктив и негатив, всё, что направлено на улучшение данного кода!

Испытательный стенд на jsFiddle (48 строк некомментированного кода).
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js