2012-12-20 76 views
6

Tôi muốn xem trước thư viện hình ảnh rộng hơn màn hình, sử dụng overflow: scroll (hoặc tự động). Ở bên phải, một bóng che phủ hình ảnh hiển thị cuối cùng sẽ cho biết rằng nhiều hình ảnh hiển thị ở bên phải.Vị trí cố định: phần tử tuyệt đối trong phần thừa: phần tử cuộn khi cuộn

Đây là một Fiddle: http://jsfiddle.net/SBdLg/

Trước tiên, tôi nghĩ: dễ dàng, cho rằng thư viện hình ảnh một box-shadow: inset. Nhưng điều đó sẽ được hiển thị phía sau hình ảnh. Bây giờ, với một chồng chéo divposition: absolute, tôi đạt đến hiệu ứng mong muốn NHƯNG box-shadow cũng di chuyển khi cuộn sang phải.

IMHO, sự cố này cũng sẽ xảy ra khi sử dụng hình ảnh có chứa bóng thay vì div ở trên cùng.

Hiệu ứng mong muốn có thể có bằng CSS không?

Trả lời

1

Xóa position: relative khỏi số outer DIV và định vị chính xác nơi bạn cần (đây là bit xấu xí) sẽ giúp bạn đạt được điều này.

Kiểm tra demo:http://jsfiddle.net/SBdLg/11/

+0

Cập nhật các bản demo để thêm một DIV bên ngoài hơn nữa với position: relative để bạn có thể di chuyển các bộ sưu tập xung quanh mà không can thiệp vào vị trí của các bóng mỗi lần. – techfoobar

+0

Cảm ơn, loại bỏ các 'vị trí: tương đối' và thêm một' div' xung quanh nó đã giúp :) –

Các vấn đề liên quan