2014-05-24 13 views
7

Vì vậy, tôi đã chỉ tạo ra opacity for interactive fading.Độ chính xác tối đa của độ mờ CSS3 là bao nhiêu?

Tuy nhiên, tôi nghĩ rằng không nên sử dụng các giá trị không có giá trị cho độ mờ đục. Nếu độ chính xác tối đa thấp hơn độ chính xác của javascript tối đa, các trình duyệt dường như làm tròn giá trị, nhưng xem xét nó thay đổi.

Vì vậy, câu hỏi là, độ chính xác tối đa phù hợp với CSS3 opacity là gì?

+5

Tôi có linh cảm tùy thuộc vào việc triển khai thực hiện. – BoltClock

+0

Tôi không có bằng chứng cụ thể, nhưng để giữ cho IE chơi đẹp, tôi luôn nghĩ về độ mờ trong số thập phân từ 0 đến 1 cho phép 11 khả năng, điều đó không nhiều nhưng họ đảm bảo 'thay đổi' –

+0

[Math.random trong Chrome] (http://jsfiddle.net/pXqdH/1/), và thiết lập và nhận 16 chữ số thập phân dường như không phải là vấn đề, tôi đoán câu hỏi là nhiều thứ sẽ thực tế hơn, và những gì bạn có thể thực sự thấy sự khác biệt của? – adeneo

Trả lời

5

Độ mờ cho phép về cơ bản bất kỳ số thập phân nào bạn muốn, nhưng vấn đề là HTML chỉ có thể thay đổi độ sáng của nó theo 256 cách khác nhau. Vì vậy, độ mờ đục nhạy cảm nhất sẽ là một thứ gì đó màu đen trên một thứ gì đó màu trắng, có thể thấy được 256 màu khác nhau. Điều này là do tỷ số giữa R, G và B phải luôn giữ nguyên để duy trì cùng một màu.

Vì vậy, vì màu nhạy nhất có 256 giá trị khác nhau, thay đổi nhỏ nhất có thể ảnh hưởng đến đầu ra hiển thị sẽ là 1/256 = 0.00390625. Về lý thuyết, đó phải là kích thước bước tối thiểu để tăng độ mờ đục của bạn.

Tôi đã thử nghiệm điều này và bằng cách sử dụng công cụ chọn màu đơn giản, tôi nhận thấy rằng trong this example fiddle, div dưới cùng là phần duy nhất có bất kỳ thay đổi nào về màu sắc. 2 div hàng đầu có màu #000000 và div dưới cùng có màu #010101. Vì vậy, tôi sẽ nói, dựa trên điều này, rằng:

  1. Các giá trị vào không được làm tròn, hoặc nếu họ đang có, họ luôn làm tròn xuống (floor function)
  2. Độ nhạy tối đa đối với opacity là 3 số thập phân.

Cần lưu ý rằng điều này đã được thử nghiệm tất cả trong Google Chrome và như BoltClock cho biết, điều này có thể thay đổi theo từng triển khai.

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