Как убрать полосу прокрутки в textarea?
Не могу убрать полосу прокрутки в textarea.
Если задаю большую высоту то она пропадает но мне нужна высота меньше (по размеру высоты текста)
Скриншот фрагмента кода удалён модератором.
- Вопрос задан более года назад
- 1053 просмотра
1 комментарий
Простой 1 комментарий
Модератор @TosterModerator
Нарушение п.3.8 Регламента. Скриншоты фрагментов кода запрещены.
Фрагменты кода надо размещать в виде текста и оборачивать тэгом code для корректного отображения. Удобно делать кнопкой
Это обязательно, см.п.3.8 Регламента.
Сюда же относится traceback, ввод и вывод в консоли и другая структурированная текстовая инфа.
Решения вопроса 0
Ответы на вопрос 3
Vladislav @SlavaMaxwell
Frontend разработчик
Ну вообще плохая практика скрывать скроллбар от пользователя, при его физическом наличии, и чтобы он не был такой жирный, попроси дизайнера нарисовать кастомный скролл, а ты потом его стилизуешь
Ответ написан более года назад
Нравится 1 1 комментарий
it_passaran @it_passaran
Что за чушь? Вечно умники со своими «супер советами». Если по дизайну стоит такая задача, то его нужно скрывать.
Как скрыть вертикальную и горизонтальную полосы прокрутки для блока div
Полосы прокрутки эффективны и необходимы для контроля общей высоты или ширины страницы. Они позволяет получить доступ к содержимому блока DIV , которое выходит за его пределы, либо с помощью прокрутки, либо с помощью функции панорамирования.
По умолчанию стилизация для полос прокрутки ( скролла ) определяются браузером, а не темой оформления вашего сайта. Поэтому их использование без дополнительной обработки может привести к результату, который будет выглядеть странно.
Браузеры на основе Webkit , такие как Chrome , Safari и т. д., предоставляют псевдоселектор для настройки цвета и размера полос прокрутки в соответствии с настройками сайта.
Вы можете убрать полосу прокрутки ( скролл ), используя следующий фрагмент CSS- кода :
.__sb-test::-webkit-scrollbar
Поскольку этот CSS-селектор специфичен для webkit-браузеров , мы должны создать резервный вариант для достижения такого же эффекта в других браузерах, таких как Firefox , IE , Edge и т.д.
Возможное решение для создания скролла на чистом CSS :
.outer < min-height:200px; width:200px; overflow:hidden; >.inner
Приведенный выше CSS-код позволяет убрать вертикальный скролл, но у этого способа есть один недостаток — в разных браузерах будет разная ширина / размер полос прокрутки. Поэтому нельзя статически указать их. Таким образом, нам нужно адаптировать данную концепцию и прописать динамическое определение высоты прокрутки с помощью JavaScript .
Решение на основе JS
Приведенный ниже скрипт позволяет скрыть полосу прокрутки ( скролл ) последовательно во всех браузерах. Это достигается следующим образом:
- Этот скрипт принудительно включает полосу прокрутки для элемента с помощью CSS overflow-x:scroll ;
- Затем вычисляется ширина полосы прокрутки;
- Рассчитанная ширина устанавливается как отрицательный отступ для внешнего элемента. Это эффективно скрывает полосу прокрутки во всех браузерах.
_findScrollbarWidth() < let parent: JQuery; let child: JQuery; if (this.sbarWidth === null) < const style = document.createElement('style'); style.innerHTML = '.__sb-test::-webkit-scrollbar < width: 0px; >‘; document.body.appendChild(style); parent = $(‘
‘) .appendTo(‘body’); child = parent.children(); this.sbarWidth = child.innerWidth() — child.height(99).innerWidth(); // очистка parent.remove(); document.body.removeChild(style); > > _hideScrollBars()
EvgeniyaPronina / no scroll
Убрать полосы прокрутки полосу прокрутки, и запретить скролл(scroll) на сайте при помощи css или js когда нам она не нужна, например при отображении того же попап окна (popup window) или любого другого всплывающего элемента на странице (рекламы).
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
| //Запретить скролл: |
| $(«html,body»).css(«overflow»,»hidden»); |
| //или только вертикальный скролл: |
| $(«body»).css(«overflow-y»,»hidden»); |
| //и на css: |
| position:fixed;overflow:hidden |
| //Запретить scroll на чистом JS можно так: |
| document.body.style.overflow = ‘hidden’; |
| //Убрать скроллинг на IPAD можно так: |
| document.body.addEventListener(‘touchmove’,function(event),false); |
| //на jQuery: |
| $(document).bind(‘touchmove’, false); |
| //P.S: Данный способ не работает на мобильных устройства, так как там используется точпад, по этому необходимо для body применять свойство position:fixed; пример: |
| создаем сам класс |
| .fixed |
| position:fixed; /*позицианируем чтобы исчез скролл*/ |
| width:100%; /*что бы верстка не складывалась по ширине*/ |
| > |
| //Применяем когда нам это необходимо |
| $(«body»).addClass(«fixed»); |
| //и убираем его когда нужно сновa включить прокрутку |
| $(«body»).removeClass(«fixed»); |
Как убрать полосы прокрутки
Перед тем как убрать полосы прокрутки (скроллбар) с веб-страницы, подумайте, действительно ли вам это так необходимо. Отсутствие возможности прокрутки содержимого веб-страницы создает трудности посетителям сайта для просмотра информации. Если же существует необходимость построения дизайнерских изысков или желание создать своим читателям трудности, то вперед, к делу. Но вас предупреждали!
Фреймы
Для управления отображением полос прокрутки во фреймах используется параметр scrolling . Он может принимать два основных значения: yes — всегда вызывает появление полос прокрутки, независимо от объема информации и no — запрещает их появление (пример 1).
Пример 1. Запрет полосы прокрутки во фреймах
Как показано в примере, в левом фрейме с именем MENU полосы прокрутки не будет. В соседнем с ним фрейме, хотя параметр scrolling и не указан, полосы прокрутки будут видны, как возможность установленная по умолчанию.
Новые окна
Чтобы удалить скроллбар из новых окон, возможностей HTML будет недостаточно. Универсальный подход требует использования языка JavaScript для создания нового окна. А в качестве одного из параметра метода window.open , который и создает окно, можно указать scrollbar=0 . Данный атрибут создает окно без горизонтальных и вертикальных полос прокрутки (пример 2).
Пример 2. Создание нового окна без полос прокрутки
Новое окно будет иметь размеры 400 x 300 пикселов и без различных элементов навигации, в том числе будут отсутствовать полосы прокрутки.
Использование стилей
Еще один способ основан на использовании стилевого атрибута overflow . Если этот параметр применить к тегу со значением hidden , скроллбар на веб-странице отображаться не будет (пример 3).
Пример 3. Запрет полосы прокрутки на веб-странице
Точно также можно убрать скроллбар и у других элементов веб-страницы, которые его содержат — некоторые элементы форм, например.
Браузер Internet Explorer поддерживает также свойство overflow-x и overflow-y , позволяющее прятать полосы прокрутки, соответственно, по горизонтали и вертикали (пример 4).
Пример 4. Запрет горизонтальной полосы прокрутки
Если вы попали в ситуацию, когда полос прокрутки, по какой-либо причине, на экране нет, а информация, тем не менее, есть, но на экран не помещается, «прокрутить» веб-страницу можно следующим способом. Нажимаем кнопку мыши, когда ее курсор находится в любом месте веб-страницы и, не отпуская, двигаем вниз. Так происходит выделение содержимого и одновременно его прокрутка. Но этот метод, мягко говоря, не очень удобен, и рекомендовать его можно лишь в очень крайних случаях.
При использовании материалов сайта ссылка на comnew.ru обязательна!