Скриншот
Функциональный плагин для Bootstrap, добавляет параметры цвета через input, сделано подробное описание, используются форматы hex, rgb, rgba, hsl, hsla.
Подробнее
Версия: v3.4.0
Каталог: Плагины Bootstrap
Категория: Улучшение
Для Bootstrap: 3, 4, 5
Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop, Shopify, WHMCS
Язык: Английский
Вес файла: 648.7 Kb
Уникальный ID: 845
Посмотрели: 1316 раз
Скачать бесплатно
Скачали бесплатно: 30 раз
Прокомментировали: 0 раз
Рейтинг: 5.0 / 5 - 1 голосов
Тип лицензии: CC BY 4.0
Авторство: https://itsjavi.com/bootstrap-colorpicker/index.html
Информация: Пользователям
Информация: Правообладателям
Поделился: BootstrapТема
Добавлено: 2016-04-03 в 20:17
Метка: 1656695938
Похожие
    Bootstrap Colorpicker Plus
    MiniColors Colorpicker AngularJS
    rgbLettersText
    Генератор подбора цветов
    Lettering.js
    jQuery Color Animate
Архив
Архив материалов которые Вы уже смотрели пока пуст
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="utf-8">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" />
 <link href="https://itsjavi.com/bootstrap-colorpicker/dist/css/bootstrap-colorpicker.css" rel="stylesheet">
<style>
 .colorpicker.colorpicker-2x {
 width: 272px;
 }

 .colorpicker-2x .colorpicker-saturation {
 width: 200px;
 height: 200px;
 }

 .colorpicker-2x .colorpicker-hue,
 .colorpicker-2x .colorpicker-alpha {
 width: 30px;
 height: 200px;
 }

 .colorpicker-2x .colorpicker-alpha,
 .colorpicker-2x .colorpicker-preview {
 background-size: 20px 20px;
 background-position: 0 0, 10px 10px;
 }

 .colorpicker-2x .colorpicker-preview,
 .colorpicker-2x .colorpicker-preview div {
 height: 30px;
 font-size: 16px;
 line-height: 160%;
 }

 .colorpicker-saturation .colorpicker-guide {
 height: 10px;
 width: 10px;
 border-radius: 10px;
 margin: -5px 0 0 -5px;
 }
</style>
</head>
<body>
 <div id="cp2" data-color="#6D2781"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js"></script>
 <script src="https://itsjavi.com/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.js"></script>
<script>
 $(function () {
 $('#cp2').colorpicker({
 inline: true,
 container: true,
 format: null,
 customClass: 'colorpicker-2x',
 sliders: {
 saturation: {
 maxLeft: 200,
 maxTop: 200
 },
 hue: {
 maxTop: 200
 },
 alpha: {
 maxTop: 200
 }
 }
 });
 });
</script>
</body>
Всего комментариев: 0
avatar

Посоветуйте этот материал другу отправив ему письмо на E - mail

Написать администрации по поводу этого материала