cách ẩn thanh cuộn dọc khi không cần thiết

Tôi có một vùng văn bản được chứa trong một div vì tôi có gợi ý jquery và muốn sử dụng độ mờ mà không thay đổi đường viền. Có một thanh cuộn dọc có thể nhìn thấy được mà tôi chỉ muốn điều này được hiển thị khi tôi đang nhập vào trường văn bản và nó vượt ra ngoài vùng chứa. Tôi đã thử tràn: auto; nhưng không hoạt động.

Trương Văn bản:

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

Kiểu dáng:

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

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

overflow: auto(hoặc overflow-y: auto) là cách chính xác để đi.

Vấn đề là vùng văn bản của bạn cao hơn div của bạn. Div kết thúc cắt bỏ hộp văn bản, vì vậy mặc dù có vẻ như nó sẽ bắt đầu cuộn khi văn bản cao hơn 159pxnó sẽ không bắt đầu cuộn cho đến khi văn bản cao hơn 400pxchiều cao của hộp văn bản.

Hãy thử cái này: http://jsfiddle.net/G9rfq/1/

Tôi đặt tràn: tự động trên hộp văn bản và làm cho hộp văn bản có cùng kích thước với div.

Ngoài ra, tôi không tin rằng việc có divbên trong a là hợp lệ label, trình duyệt sẽ hiển thị nó, nhưng nó có thể gây ra một số điều thú vị xảy ra. Ngoài ra của bạn divkhông đóng cửa.

overflow: auto;hoặc overflow: hidden;nên làm điều đó tôi nghĩ.

Thêm lớp này vào lớp .css

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

và sử dụng lớp trong div. như ở đây.

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

Tôi có hình ảnh đính kèm, bạn xem phần đưa ra của đoạn mã trên