• Более удобный DateTimePicker разработка автора xdan.ru

    JQuery UI - это набор пользовательских интерфейс виджетов, компонентов и эффектов. Datepicker - это небольшой виджет календарик, удобный прежде всего тем, что пользователь может легко выбрать нужную дату, при этом дата запишется в требуемом формате, и не будет требовать стандартизации. 

    Вот так виджет Datepicker выглядит из под коробки в стандартном jQuery UI

    Стандартный Dateicker из jQuery UI

     Все лаконично и просто. Но есть один большой минус. В нем нет редактирования времени. Собственно потому виджет и называется DatePicker, аналогичный виджет со временем должен был бы называться DateTimePicker) К сожалению такого виджета в библиотеке нет. Для простоты Datepicker,TimePicker и dateTimePicker обычно обобщают в одно понятие DatePicker.

    К слову в html5 появились новые элементы ввода, в том числе Date и DateTime Picker'ы. Но мало того, что поддерживаются они не во всех браузерах, так еще и эта самая поддержка оставляет желать лучшего. Приведу пример, как выглядит html5 datepicker в разных браузерах

  • range2dSlider плагин на jQuery ​Вновь статья в названии содержит громогласное «самый лучший». Время показало, что когда я рассказывал про datetimepicker, эти слова оказались верны. Сейчас я более чем уверен, jQuery плагин range2DSlider придется многим по вкусу.

    Море настроек конфигурации делают этот плагин одним из лучших в своем роде. Просто взгляните, на что он способен:

     

    Та, конфигурация, для которой он был создан 2d слайдер

    Показать код

    Или обычный range слайдер (ползунок), альтернатива нативному input type="range", но с поддержкой нескольких значений

    Показать код

    Вертикальный вариант исполнения, того же ползунка input type="range"

     

    Показать код

    В подсказке над(под/слева/справа) ползунком можно выводить не только текущие значения. Все кастомизируется довольно просто

    Показать код

    Не нравится внешний вид? Я старался, честно! Ну что же, добавим своих стилей, и легким движением руки, брюки превращаются...

    Показать код

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

  • Для любого input на странице можно задать свой стиль отображения. Но не для input type="checkbox". Попробуйте поменять размер этого элемента или округлить углы его рамки. Ко всему прочему все браузеры отображают этот элемент по разному.

    Был обычный рабочий день, у меня болела голова и я искал что-то очень простое для решения этой проблемы. Но к великому моему удивлению, большинство решений найденных мною в сети, предлагали жуткие манипуляции с ксс и разметкой страницы, потом требовалось вставить js код, который бы отвечал за логику. Простые же решения типа jquery плагина, оказались абсолютно не допиленными.

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

    Представляю Вашему вниманию xdCheckbox jQuery плагин для стилизации input checkbox

    Страница проекта

    Исходные файлы