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

Question

У меня есть текстовая область, которая содержится в div, поскольку у меня есть подсказка jquery, и я хотел использовать прозрачность без изменения границы.Есть видимая вертикальная полоса прокрутки, как я хочу, чтобы это отображалось только тогда, когда я набираю текстовое поле, и оно выходит за пределы контейнера.Я пробовал переполнение: авто;но не работает.

Текстовое поле:

<label>
    <div id="name">
        <textarea name="message" type="text" id="message"
            title="Enter Message Here"
            rows=9 cols=60 maxlength="2000"></textarea>
    </div>
</label>

Стили:

#name { 
    border: 1px solid #c810ca;
    width: 270px;
    height:159px;
    overflow: hidden; 
    position: relative;
    }

#message {
    height: 400px;
    width: 235px;
    overflow: hidden;
    position: absolute;
}

Answer 1

overflow: auto (или overflow-y: auto) - правильный путь.

Проблема в том, что ваша текстовая область выше вашего div.DIV заканчивает тем, что обрезал текстовое поле, поэтому даже если он выглядит так, как будто он должен начать прокрутку, когда текст выше 159px, он не начнет прокручиваться, пока текст не станет выше 400px, который является высотой текстового поля.

Попробуйте это: http://jsfiddle.net/G9rfq/1/

Я установил переполнение: auto для текстового поля и сделал текстовое поле того же размера, что и div.

Также я неНе веря, что внутри label действительно есть div, браузер отрендерит его, но это может привести к неожиданным вещам.Также ваш div не закрыт.

Answer 2

overflow: auto; или overflow: hidden; должен сделать это, я думаю.

Answer 3

Добавьте этот класс в .css class

.scrol  { 
font: bold 14px Arial; 
border:1px solid black; 
width:100% ; 
color:#616D7E; 
height:20px; 
overflow:scroll; 
overflow-y:scroll;
overflow-x:hidden;
}

и используйте этот класс в div.как здесь.

<div> <p class = "scrol" id = "title">-</p></div>

Я приложил изображение, вы видите выход кода выше