2013-04-10 23 views
5

Tôi chỉ nhận thấy một sự mâu thuẫn giữa cách trình duyệt xử lý các css: trạng thái hoạt động của một phần tử khi nó là phải nhấp (ContextMenu nhấp chuột)css ": hoạt động" với click chuột phải, mâu thuẫn với thực hiện trình duyệt

  • Firefox:: hoạt động không được kích hoạt
  • Chrome:: hoạt động được kích hoạt trong giây lát, cho đến khi xảy ra mouseup
  • Safari 5 & IE 10:: hoạt động được kích hoạt và yếu tố vẫn là: hoạt động cho đến khi ContextMenu bị đóng

Dưới đây là một jsfiddle nhanh chóng để tái tạo này http://jsfiddle.net/annam/tqBqV/

div { background: red; } 
div:active { background: green; } 

Bất cứ ai cũng biết đó là hành vi có đúng không? Tôi đoán không có cách nào để tiêu chuẩn hóa?

+0

': hoạt động' thường có nghĩa là để nhấp chuột trái –

+0

@ Mr.Alien chính xác :) lý tưởng cho nó sẽ không bao giờ kích hoạt khi nhấp chuột phải, nhưng than ôi, nó hoạt động và không nhất quán! –

+2

"(và đây là một số mã vô dụng vì sa yêu cầu mã khi liên kết js fiddle được đưa ra)" jsFiddle không tải cho tôi, vì vậy tôi không thể biết mã đó thực sự có nghĩa là chỉ để bộ lọc chất lượng được thiết kế chính xác cho các tình huống như khi jsFiddle từ chối tải, hoặc nếu mã đến từ fiddle của bạn mà sẽ obviate, và không đề cập đến mâu thuẫn, như một bình luận biên tập. – BoltClock

Trả lời

9

Selectors 3 nói :active là đúng khi một phần tử đang được kích hoạt, và tiếp tục định nghĩa kích hoạt thông qua một thiết bị trỏ như một con chuột được khi nút chính được nhấn:

  • Các :active pseudo-class áp dụng khi một thành phần đang được kích hoạt bởi người dùng. Ví dụ: giữa những lần người dùng nhấn nút chuột và thả nó ra. Trên các hệ thống có nhiều nút chuột, :active chỉ áp dụng cho nút kích hoạt chính hoặc nút chính (thường là nút chuột "trái") và bất kỳ bí danh nào của chúng.

Nếu một nhấp chuột thứ kích hoạt một phần tử cho mục đích của :active trong một trình duyệt cụ thể, sau đó trình duyệt đó là vi phạm spec (trừ khi trình duyệt duy nhất tuyên bố để thực hiện CSS2.1, nơi hạn chế này là không đặt trong đá, nhưng điều đó không đúng cho bất kỳ trình duyệt nào được cung cấp).

+0

+1. Giá trị trỏ tới [spec] (http://www.w3.org/TR/CSS2/selector.html#dynamic-pseudo-classes) trực tiếp, vì nó cố ý mơ hồ: "CSS không xác định các phần tử nào có thể nằm trong Scripting có thể thay đổi liệu các phần tử có phản ứng với các sự kiện của người dùng hay không, và các thiết bị và UA khác nhau có thể có các cách khác nhau để trỏ đến hoặc kích hoạt các phần tử. " – CherryFlavourPez

+0

@CherryFlavourPez: Tôi đã cập nhật với một liên kết đến thông số kỹ thuật gần đây hơn, mà * không * xác định nó ở một mức độ nào đó. Thông số bộ chọn CSS2.1 có thể được coi là lỗi thời cho các trình duyệt triển khai Selectors 3+. Điều đó nói rằng tôi sẽ chỉnh sửa câu trả lời của tôi một lần nữa để giải thích về điều này. – BoltClock

+1

vì vậy firefox có quyền bằng cách không kích hoạt: hoạt động ở tất cả! và safari & ie không chỉ vi phạm quy tắc "chỉ khóa chính", chúng còn vi phạm "giữa thời gian người dùng nhấn chuột và giải phóng" quy tắc bằng cách duy trì trạng thái hoạt động ngay cả sau khi nút chuột được nhả. cảm ơn rất nhiều! –

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