Về mặt kỹ thuật điều này có thể miễn là bất kỳ phần tử nào không vượt quá chiều cao tối đa. Nhưng với mục đích thực tế, điều đó là không thể bởi vì hành vi của trình duyệt trở nên lạ khi chiều cao cơ thể tổng thể vượt quá giới hạn.
Điều này thực sự dường như làm việc OK trong IE11:
div{
background: red;
color: white;
height: 10737418px;
}
.blue {
background: blue;
color: white;
}
<div>
Test
</div>
<div class="blue">
Test
</div>
<div>
Test
</div>
<div class="blue">
Test
</div>
Tất cả bốn div s xuất hiện với CSS áp dụng. Bạn có thể tìm kiếm từ "test" và nó sẽ di chuyển đến từ đó cả bốn lần.
Trong Firefox, chiều cao cuộn sẽ lớn hơn so với kích thước tối đa nhưng nó sẽ ngừng render bất cứ điều gì dưới nó:
div{
border: 3px solid purple;
height: 17895697px;
}
.blue {
background: blue;
color: white;
}
.red {
background: red;
color: white;
}
<div>
Test
</div>
<div class="blue">
Test2
</div>
<div class="red">
Test3
</div>
Hộp đầu tiên có viền tím 3px. Firefox thậm chí sẽ không hiển thị đường viền dưới cùng và 2 đường khác div không hiển thị. Trình duyệt có thể cho biết từ "kiểm tra" nằm trong trang 3 lần nhưng sử dụng 'Tìm' sẽ không làm cho trang cuộn đến các trang khác div s. Nó chỉ ngồi đó.
Trong Chrome, mọi thứ chỉ có được kỳ lạ:
div{
border: 3px solid #000000;
background: #CCCCCC;
height: 99999999999999999999999999999999999999px;
}
<div>
Test
</div>
<div>
Test2
</div>
<div>
Test3
</div>
Các div đầu tiên không nhận được một biên giới ở tất cả và sau đó vì một lý do biên giới div lặp đi lặp lại nhiều lần sau div đầu tiên mặc dù chỉ có hai khác div giây trong trang. "Tìm" của Chrome không nhận ra rằng từ 'Kiểm tra' chỉ ở trên trang 3 lần nhưng nó cho rằng từ thứ hai ở cuối trang. Từ 'Kiểm tra' không hiển thị thời gian thứ 2 hoặc thứ 3.
Bạn nhận được hành vi lạ khác nếu bạn đặt các phần tử cao trong một vùng chứa có chiều cao cố định và bộ tràn được đặt để cuộn.
Cách duy nhất tôi có thể thấy để giải quyết vấn đề này là đảm bảo chiều cao của trang không vượt quá giới hạn.
Nếu nội dung tĩnh, chỉ cần chia nhỏ trên nhiều trang.
Nếu đó là nội dung động bạn có thể:
Cài giới hạn tùy vào bao nhiêu nội dung được đặt trên trang trước khi nó tạo ra một liên kết đến các trang khác
Đặt một giới hạn về bao nhiêu nội dung hiển thị cùng một lúc
- EX: Trang Câu hỏi thường gặp với bố cục accordion, do đó bạn phải nhấp vào câu hỏi để câu trả lời xuất hiện và chỉ có một câu trả lời hiển thị tại một thời điểm
Đặt một giới hạn về số hồ sơ/kết quả được trả
Ẩn/sụp đổ/qua loại bỏ nội dung người dùng đã cuộn (Tôi đã không cố gắng này, nhưng nếu bạn có thể làm điều đó Tôi không thấy lý do tại sao nó không hoạt động.)
Điều này thật thú vị nhưng tôi không chắc chắn câu hỏi là gì. – BSMP
@BSMP: Tôi quên thêm câu hỏi. Bây giờ tôi đã thêm câu hỏi. –
Đối với những gì nó có giá trị, nếu tôi thêm 10 hơn 9s vào ví dụ Chrome, thanh cuộn sẽ biến mất. – BSMP