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

У меня есть текстовое поле, которое содержится в 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;
}

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

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

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

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

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

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

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

.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>

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