2010-07-30 25 views
7

:-moz-system-metric(touch-enabled) trông giống như một bộ chọn CSS thực sự hữu ích để làm việc trên các trang di động.Tương đương với Webkit: -moz-system-metric (cảm ứng)

Thật không may Webkit chiếm ưu thế trên các thiết bị cảm ứng di động để có ai biết liệu có tương đương với Webkit không?

(Lý tưởng nhất là nó muốn được tốt nếu điều này được quản lý bởi các truy vấn phương tiện CSS3)

Edit:Looks like it is supported in Gecko as a media query

Trả lời

1

Chrome là một trình duyệt khác mà cố gắng thực hiện một chọn tương tự nhưng tiếc là nó đã được gỡ bỏ ra cho bây giờ.

Modernizr có thể là công cụ phát hiện thú vị vì nó cũng có thể phát hiện các sự kiện chạm.

http://www.modernizr.com/docs/#touch

5

Không có cách nào để thực hiện điều này mà không cần sử dụng Javascript, hiện tại.

Như @easwee đã nói, Modernizr là thư viện JS được đánh giá cao tập trung vào phát hiện tính năng. Bạn có thể sử dụng thử nghiệm touch cho trường hợp sử dụng của mình.

Nếu bạn không cần tất cả các chuông và còi Modernizr, bạn có thể làm như sau:

A) Tải JS sau càng sớm trong thẻ <body> của bạn khi bạn có thể:

<script type="text/javascript"> 
if(!!window.TouchEvent) body.className += " touch-enabled "; 
</script> 

B) Viết CSS của bạn. Kể từ Gecko sử dụng một truy vấn phương tiện truyền thông để thông báo cho bạn về những tính sẵn sàng liên lạc, bạn sẽ phải đánh lừa Phương CSS liên lạc cụ thể, như vậy:

BODY.touch-enabled DIV.foo 
{ 
    /* touch-specific CSS */ 
} 

@media screen and (-moz-touch-enabled) 
{ 
DIV.foo 
{ 
    /* touch-specific CSS */ 
} 

} 

Nếu mã mỗi selector là giống hệt nhau trong cả hai trường hợp, GZIP phải tối ưu hóa một số sự trùng lặp. (Bạn đang sử dụng nén, tôi hy vọng.)

2

Trong câu trả lời của Ian Wessman, bài kiểm tra !!window.TouchEvent hoạt động không chính xác. Trong Chrome dành cho máy tính để bàn hiện tại (23.0.1271.52, Linux) window.TouchEvent là một chức năng, do đó mã của Ian xem xét việc bật trình duyệt đã bật.

Nếu bạn muốn có mã ngắn, tốt nhất bạn nên sao chép-dán relevant code from Modernizr.

+0

https://github.com/Modernizr/Modernizr/blob/master/feature-detects/touchevents.js – eimaj

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