Перемещение и прокрутка листа. Активация обратной прокрутки в Windows Настройка полосы прокрутки

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

В данной статье мы рассмотрим jQuery плагины, позволяющие сделать нестандартную полосу прокрутки в браузере, так как CSS свойства поддерживаются не всеми браузерами.

Приступим к рассмотрению данных плагинов, которые изменяют вид полосы прокрутки в браузере.

1. NiceScroll.js

NiceScroll является jQuery плагином, который позволяет создать полосу прокрутки похожую на iOS.

2. NanoScroll

Данный плагин позволяет создать полосу прокрутки на вашем сайте как в Mac OS X.

3. jQuery custom content scroller

Плагин jQuery для стилизации полосы прокрутки в браузере с помощью CSS.

4. Tiny Scrollbar

Легкий jQuery плагин написанный с помощью jQuery библиотеки, который придаст красивый вид прокрутки контента и полосы прокрутки главного окна браузера.

5. Scrollbar Visibility

Легкий плагин написанный с помощью jQuery библиотеки, который придаст красивый вид прокрутки контента и полосы прокрутки главного окна браузера.

6. jScrollPane

С помощью данного плагина также можно делать пользовательские полосы прокрутки, которые работают во всех современных браузерах. Стили можно менять с помощью CSS файла.

7. Scrollbar Paper

С помощью данного плагина нельзя придать стиль полосе прокрутки которая у браузера, но можно задать для содержимого фреймов внутри страницы.

8. jQuery Scrollbars v2

Полностью настраиваемые полосы прокрутки, а также показывает стандартные если Javascript отключен в браузере.

9. Vertical scrollbar

Для данного плагина необходимо фиксированная высота контейнера, потому что полоса прокрутки расположена справа с помощью позиционирования.

Прокрутка страниц в системе Microsoft Windows обеспечивается настройками мыши и параметрами отображения полосы прокрутки. Обе эти настройки не требуют специальных компьютерных навыков и доступны рядовому пользователю.

Инструкция

  • Нажмите кнопку «Пуск» для вызова главного меню системы и перейдите в пункт «Панель управления».
  • Выберите раздел «Мышь» для настройки параметров мыши.
  • Откройте закладку «Параметры указателя» (для Windows XP) или закладку «Перемещение» (для Windows 9x и ME) и установите бегунок «Скорость перемещения указателя» в нужную позицию.
  • Нажмите кнопку «Применить» для выполнения команды и перейдите на вкладку «Кнопки мыши».
  • Сдвиньте бегунок, регулирующий скорость двойного клика, в нужную сторону.
  • Нажмите кнопку «Применить» для подтверждения выполнения команды и перейдите на вкладку «Прокрутка» («Колесико» или «Кнопки мыши» в зависимости от версии Windows).
  • Установите желаемую скорость и нажмите кнопку OK для применения выбранных изменений.
  • Перейдите на вкладку «Указатели» и выберите нужную схему из предлагаемых стандартных схем указателя в списке «Схемы».
  • Перейдите к настройке полосы прокрутки. Для этого вернитесь в главное меню «Пуск» и перейдите в пункт «Панель управления».
  • Выберите пункт «Внешний вид и персональные данные» и откройте «Параметры полосы прокрутки Windows».
  • Настройте необходимые параметры по своему вкусу и нажмите кнопку OK для подтверждения выполнения команды.
  • Выполните клик правой кнопки мыши на поле полосы прокрутки для вызова контекстного меню и выберите пункт «Добавить мини-приложение» для добавления гаджетов.
  • Вызовите сервисное меню кликом правой кнопки мыши на поле ненужного мини-приложения и выберите команду «Закрыть мини-приложение» для операции удаления установленного гаджета.
  • Нажмите кнопку «Удалить», появляющуюся в момент перемещения курсора мыши на мини-приложение.
  • Выберите ссылку «Загрузить мини-приложения из сети Интернет» в Галерее мини-приложений для загрузки и установки дополнительных гаджетов и выберите желаемые на веб-сайте Microsoft Gadgets.
  • Совет добавлен 13 октября 2011 Совет 2: Как изменить прокрутку страниц Прокрутка страниц в среде операционной системы Windows зависит от двух вещей: настроек мыши и параметров отображения полосы прокрутки. Чтобы изменить прокрутку, нужно подкорректировать два вышеупомянутых пункта.

    Инструкция

  • Войдите в меню кнопки «Пуск». Выберите пункт «Панель управления». Перед вами появится окно. Чтобы изменить прокрутку страниц, выберите иконку «Мышь» и дважды кликните по ней левой кнопкой. Зайдите во вкладку параметры указателя.
  • Скорректируйте скорость перемещения курсора таким образом, чтобы она, по вашему мнению, была оптимальной. Нажмите кнопку «Применить». После этого перейдите на вкладку того же окна «Кнопки мыши». Найдите бегунок, который отвечает за скорость двойного клика.
  • Установите его в нужную позицию. В зависимости от выбранного расположения бегунка на шкале, реакция на двойной клик будет быстрее или медленнее. примените изменения и перейдите во вкладку «Прокрутка». Точно таким же образом отрегулируйте скорость вращения скроллера вашей мыши, примените изменения.
  • После этого перейдите во вкладку «Указатели». Вам будет предложено несколько стандартных схем. Выберите наиболее подходящую, или сделайте собственную примените изменения и нажмите кнопку Ок. после этого вернитесь к окну «Панель управления», чтобы продолжить менять прокрутку страниц.
  • Найдите в окне «Панели управления» пункт «Параметры полосы прокрутки Windows». Обычно он находится в персональных данных. Настройте параметры полосы прокрутки в соответствии с вашими пожеланиями и примените изменения.
  • Кликните правой кнопкой мыши в поле полосы прокрутки, чтобы вызвать контекстное меню. В нем выберите пункт «Добавить мини-приложение». Появится несколько мини-приложений, которые позволят изменить прокрутку.
  • Выберите нужные, остальные закройте. Для этого кликните правой кнопкой мыши по ненужному приложению, и выберите пункт «Закрыть». Чтобы изменить скорость прокрутки, используйте скроллер. Нажмите на него один раз и перемещайте мышку. Скорость перемещения полосы прокрутки будет прямым образом зависеть от скорости ваших движений.
  • Как изменить прокрутку страниц - версия для печати

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

    Данное решение является очень удобным, так, как здесь не задействуются JavaScript . Что в свою очередь убирает нагрузку на сайт. Все работает с помощью стилей и имеет минимум кода.

    Установка

    Вставляем данный код в Таблицу стилей (CSS)

    ::-webkit-scrollbar-button {
    background-image:url("");
    width:5px;
    height:0px
    }

    ::-webkit-scrollbar-track {
    background-color:#ecedee
    }

    ::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0px;
    border-radius: 0px;
    background-color:#6dc0c8;
    }

    ::-webkit-scrollbar-thumb:hover{
    background-color:#56999f;
    }

    ::-webkit-resizer{
    background-image:url("");
    background-repeat:no-repeat;
    width:4px;
    height:0px
    }

    ::-webkit-scrollbar{
    width: 4px;
    }

    Установка на этом завершена. Теперь разберем, какая строка за что отвечает.

    Цвет дорожки, по которой двигается бегунок прокрутки.

    Меняем ecedee на свой цвет.

    ::-webkit-scrollbar-track {
    background-color:#ecedee
    }

    Цвет бегунка полосы, а так же его закругление.

    Меняем 6dc0c8 на свой цвет.

    Меняем значение border-radius для закругления.

    ::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0px;
    border-radius: 0px;
    background-color:#6dc0c8;
    }

    Цвет бегунка при наведении на него курсора.

    Меняем 56999f на свой цвет.

    ::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0px;
    border-radius: 0px;
    background-color:#6dc0c8;
    }

    Основная ширина полосы прокрутки.

    Меняем значение width

    ::-webkit-scrollbar{
    width: 4px;
    }

    Пример

    В качестве примера мы сделали прокрутку в таком стиле:

    Установите на сайт данный скролл, просто скопировав следующий код:

    200?"200px":""+(this.scrollHeight+5)+"px");"> ::-webkit-scrollbar-button {
    background-image:url("");
    background-repeat:no-repeat;
    width:6px;
    height:0px
    }

    ::-webkit-scrollbar-track {
    background-color:#32312e;
    box-shadow:0px 0px 3px #000 inset;
    }

    ::-webkit-scrollbar-thumb {
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color:#ffcb17;
    box-shadow:0px 1px 1px #fff inset;
    background-image:url("https://сайт/_pu/24/59610063.png");
    background-position:center;
    background-repeat:no-repeat;
    }

    ::-webkit-resizer{
    background-image:url("");
    background-repeat:no-repeat;
    width:7px;
    height:0px
    }

    ::-webkit-scrollbar{
    width: 11px;
    }

    Настраивая скроллинг, важно понимать следующие моменты:

    1. Скорость прокрутки внешней мыши и тачпада регулируются разными настройками.

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

    Итак, войдите в Панель управления и выберите раздел Мышь :

    Изменение скорости прокрутки мыши

    Перейдите на вкладку Колесико .

    Выберите, на сколько строк будет смещаться прокручиваемый контент за один шаг (щелчок) колесика:

    Изменение скорости прокрутки тачпада

    Для изменения параметров тачпада в системе обязательно должен быть установлен драйвер устройства. Его всегда можно найти на сайте производителя ноутбука . Также, спешим заметить, что Windows 8.1 способна успешно находить и устанавливать драйверы популярных устройств самостоятельно через Интернет. И тачпад — не исключение. На картинках ниже мы показываем, как настроить сенсорную панель от производителя Synaptics, которым комплектуется наш ноутбук HP. Всё, что мы сделали — это установили лицензионную Windows 8.1 и подключились к wifi-роутеру. А через несколько минут нужный touchpad driver был скачан и установлен вместе с драйверами других устройств и обновлениями Windows.

    Поэтому вы можете выполнить поиск обновлений вручную и есть большая вероятность, что Windows скачает недостающий драйвер:

    Перейдите на вкладку Параметры устройства .

    Выделите в списке ваше устройство.

    Нажмите кнопку Параметры :

    В окне настроек сенсорного устройства перейдите в раздел Прокрутка .

    Выберите нужную скорость (в нашем случае её нужно было уменьшить).

    Нажмите Применить для сохранения изменений:

    Я изменил скорость прокрутки. Почему она не меняется?

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

    После изменения настроек скроллинга в расширении, необходимо обновить страницу браузера (F5) для того, чтобы изменения вступили в силу.

    Нажмите кнопку Меню .

    Выберите Дополнительные инструменты .

    Кликните на Расширения :

    Найдите в списке нужное расширение и нажмите на ссылку Параметры под ним:

    Если говорить конкретно о расширении SmoothScroll, то для изменения скорости прокрутки веб-страниц вам нужно задать нужное значение в поле Step size и нажать кнопку Save Settings внизу страницы:

    Как изменить скорость перемещения указателя

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

    Перейдите на вкладку Параметры указателя .

    Выберите комфортную скорость с помощью регулятора.

    С выходом Windows 10 для тачпада ноутбуков добавилась новая функция, которая уже давно есть в OS X- жесты пальцами на тачпаде, в том числе прокрутка двумя пальцами страниц вертикально либо горизонтально. Но есть небольшая неприятность: все привыкли, что при прокрутке вниз содержимое страницы движется вверх и наоборот, а в Windows 10 реализовано совсем непривычно- содержимое страницы движется вслед за прокруткой, к чему довольно трудно привыкнуть. На всех форумах, где я искал решение этой проблемы, согласно инструкциям требуется редактировать реестр, что для многих пользователей может быть затруднительно. Но в большинстве случаев это можно сделать проще.

    Нажимаем кнопку Пуск и выбираем Параметры , в открывшемся окне выбираем раздел Устройства (Bluetoth, принтеры, мышь). Если ноутбук оборудован т.н. тачпадом повышенной точности, вы увидите тут же переключатель Изменить направление прокрутки .

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

    Нажимаем кнопку Параметры , переходим на вкладку Прокрутка

    Здесь нужно снять галочки с пунктов Направление переключения или Направление прокрутки (возможны и другие варианты, у разных моделей может быть по разному, но по названию вы поймете назначение) и нажимаем ОК везде. Все, можно пользоваться прокруткой привычным способом.



    Есть вопросы?

    Сообщить об опечатке

    Текст, который будет отправлен нашим редакторам: