Отзывчивый бутстрап 3 раза?

Кто-нибудь знает о хорошем отзывчивом бутстрапе 3 timepicker?

Ive провела неделю, проходя через timepicker после timepicker, и всегда была проблема, например: http://jdewit.github.io/bootstrap-timepicker/ была бы идеальной, но для бутстрапа 2, http://www.malot.fr/bootstrap-datetimepicker/ не реагирует, и я просмотрел по крайней мере еще 3, которые либо не будут работать для bootstrap 3, не были отзывчивы, либо не поддерживали 24-часовую систему (которая мне нужна)

Так что, если кто-нибудь знает какую-нибудь хорошую, которая выглядит аккуратно, как, например, jdewit, то есть отзывчивая и которая поддерживает 24-часовую систему, пожалуйста, поделитесь ею, было бы очень признательно и закончило бы мой недельный поиск, чтобы я мог наконец перейти к что-то новое: p Спасибо!

Ответы

Ответ 1

Прежде всего, я нашел эту библиотеку прямо здесь. Отлично работает из коробки в среде Bootstrap-3.

Bootstrap-3 Clock-Picker

CSS

<link rel="stylesheet" type="text/css" href="dist/bootstrap-clockpicker.min.css">

HTML

<div class="input-group clockpicker">
    <input type="text" class="form-control" value="09:30">
    <span class="input-group-addon">
        <span class="glyphicon glyphicon-time"></span>
    </span>
</div>

JAVASCRIPT

<script type="text/javascript" src="dist/bootstrap-clockpicker.min.js"></script>
<script type="text/javascript">
    $('.clockpicker').clockpicker();
</script>

Так просто! Другие примеры можно найти по ссылке выше.

Обновление 18/04/2018

Если вы используете Bootstrap-4, самая популярная библиотека выбора времени/даты, доступная сейчас, - это Tempus Dominus. Это не модно выглядит, но очень отзывчиво и современно.

Бутстрап-4 Темпус Доминус

Ответ 2

Это слегка измененная версия http://jdewit.github.io/bootstrap-timepicker/, которая поддерживает загрузку 3. Вы можете проверить это здесь. https://github.com/m3wolf/bootstrap3-timepicker Дайте мне знать, если это не сработает, и я попытаюсь найти альтернативу.

Update. Вот еще один вариант, основанный на той же версии, но модифицированный для загрузки. https://github.com/rendom/bootstrap-3-timepicker

Обновление 2. Вот еще один. http://bootstrapformhelpers.com/timepicker/

Ответ 4

Как обновление вопроса OP, я могу подтвердить, что timepicker, найденный в http://jdewit.github.io/bootstrap-timepicker/, действительно работает с Bootstrap 3 сейчас с никаких проблем вообще.

Ответ 5

Kendo UI предоставляет лучший и совершенный набор компонентов JavaScript UI с библиотеками для jQuery, Angular, React и Vue. Вы можете быстро создавать привлекательные, высокопроизводительные и быстро реагирующие веб-приложения независимо от того, какой у вас JavaScript-фреймворк. Вот из них пользовательский интерфейс пользовательского интерфейса:

Также ниже приведено альтернативное и простое решение

<!--Css-->
<link href="css/timepicker.css" type="text/css" rel="stylesheet" />

<!--Html-->
<div class="row">
    <div class="col">
        <label class="label-in">Time</label>
        <input class="timepicker" id="event-time" type="text" value="" required="">
    </div>
</div>

<!--Script-->
<script src="Scripts/ClockPicker.js"></script>
<script>
   $('.timepicker').timepicker({
     });
</script>

Вот еще один популярный фреймворк Bootstrap Time Picker из mdbootstrap