Форум на Исходниках.RU https://forum.sources.ru Форум на Исходниках.RU Форум на Исходниках.RU https://forum.sources.ru/index.php?showtopic=454653&view=findpost&p=3915009 Tue, 17 Dec 2024 15:51:17 +0000 Стили jQuery https://forum.sources.ru/index.php?showtopic=454653&view=findpost&p=3915009 cupoma58 HTML, CSS https://forum.sources.ru/index.php?showtopic=454653&view=findpost&p=3914985 Mon, 16 Dec 2024 12:28:04 +0000 Стили jQuery https://forum.sources.ru/index.php?showtopic=454653&view=findpost&p=3914985 jQuery предлагает типовой слайдер/прогресс-бар, состоящий из следующих
компонентов:

1. ui-slider (z-index:0) - контейнер прогресс-бара
2. ui-slider-range (z-index:1) - итог прогресса
3. ui-slider-handle (z-index:2) - ползунок
    .progres {                      /* ui-slider/прогрeс-бар */
        -webkit-appearance: none;   /*добавлено, коррекция*/
        position: absolute;
        text-align: left;
        bottom: 35px;
        height: 2px;
        width: 96%;
        border: 1px solid #ff0000;  /*добавлено, коррекция*/
        margin: 0 0 0 2%;  
        background: transparent;
        cursor: pointer;
    }
     
    .progres:hover + .tool-tip {
        display: block;
    }
     
    .progres .ui-slider-range {     /* цвет уровня */
        z-index: 1;
        position: absolute;
        background: #ccc;
    }
     
    .progres .ui-slider-handle {     /* ползунок */
        z-index: 2;
        position: absolute;
        width: 10px;  
        height: 10px;
        border-radius: 100%;
        background: #ccc;  
        margin: 1px 0 0 -2px;
        outline: none;
        border: none;
    }

С коррекцией 2-го и 3-го компонентов - проблем нет.
1-й компонент, браузер (Chrome), видит в обрамлении (~1px) border, белого
цвета. В стилях библиотеки (jquery-ui-1.13.2.css) - это оформление не
оговаривается. Попытка отключить мнение браузера (-webkit-appearance: none;)
и задать собственный цвет border - оказалась неудачной. Точнее - новый цвет
border проявляется но, только при перезагрузке страницы, мельком.
Что, я, упускаю?]]> cupoma58 HTML, CSS