2015-01-08 17 views
5

Tôi dường như không thể tìm thấy câu trả lời cho điều này và tôi mất một thời gian để tái tạo nó như là một đứng một mình fiddle/bút nhưng cuối cùng tôi đã có.Sự kiện D3 bắn trên một yếu tố svg ẩn

tôi đang làm việc trên ứng dụng Vaadin trong đó sử dụng D3 để vẽ và thao tác đồ họa svg. Tại thời điểm có svg trên màn hình có visibility:hidden.

Công trình này hoàn toàn tìm thấy trong tất cả các trình duyệt.

Những yếu tố tiềm ẩn có kích và các sự kiện mouseover, mà một lần nữa làm việc tìm thấy trong tất cả các trình duyệt Tuy nhiên trong firefox phiên bản 34 yếu tố ẩn vẫn cháy, sự kiện của họ (nhấp chuột phải và di chuột) khi họ vẫn đang ẩn.

Để giải thích rõ hơn: khi một nút được ẩn, sự kiện mouseover của nó không nên sa thải, khi nó có thể nhìn thấy nó nên. Đó là cách nó hoạt động trong tất cả các trình duyệt ngoại trừ firefox 34, 35 beta và 36 phiên bản dev. Nó hoạt động tốt trong firefox 31.

Tôi nghi ngờ đây là một lỗi trong D3, nhưng muốn có một ý kiến ​​thứ hai hoặc một ai đó để chỉ ra lỗi của tôi. Cần lưu ý rằng thiết lập display:none trên phần tử hoạt động trong firefox 34 trở lên, tuy nhiên tôi không cảm thấy rằng vấn đề nằm ở đó

Tôi đã tạo một biểu tượng jsbin, có hai biểu tượng màu cam, một biểu tượng có visibility:hidden (bạn có thể cần phải vô hiệu hóa để xem nó) nếu bạn di chuột qua phần tử ẩn với chrome, không có gì xảy ra. nhưng với firefox 34 sự kiện cháy. Here's the jsBin

Bất cứ ý tưởng là tại sao nó sẽ bắn? Tôi đoán hoặc D3 vấn đề hoặc firefox lỗi, tuy nhiên tôi muốn để móng tay nó xuống hoặc sửa chữa mã của tôi về đóng góp cho một sửa chữa trong các lĩnh vực khác

Cảm ơn

+0

Có lý do tại sao bạn đi với khả năng hiển thị: bị ẩn thay vì hiển thị: không có gì? – Elijah

+0

Không phải là kiến ​​thức của tôi, tôi đang ký hợp đồng với một dự án di sản lớn, đừng nghĩ rằng đó là bất kỳ sự suy nghĩ nào. – atmd

Trả lời

4

Đây chỉ là lỗi trong Firefox. Nếu bạn report it tôi sẽ sửa chữa nó.

Cho một giá trị cụ thể cho con trỏ-sự kiện chúng ta có thể nói chính xác cho dù nguyên tố này sẽ nhận được sự kiện hay không. Nếu chúng ta không biết giá trị con trỏ-sự kiện nào thì phần tử đó có thể hoặc không thể nhận các sự kiện con trỏ. Đó là tất cả các đặc điểm kỹ thuật đang cố gắng để nói. Không có sự mơ hồ ở đây.

Lưu ý rằng lỗi này chỉ ảnh hưởng đến firefox <image> yếu tố. Nếu bạn thay thế hình ảnh bằng phần tử <rect>, bạn sẽ thấy kết quả chính xác ngay cả trong Firefox.

+1

Tuyệt vời, cảm ơn vì điều này. Trong một đi tôi rất vui vì một lỗi của nó và không chỉ tôi đi điên. Đã báo cáo https://bugzilla.mozilla.org/show_bug.cgi?id=1119698 – atmd

2

Các spec bang rằng đây là hành vi bình thường :

Tùy thuộc vào giá trị của thuộc tính ‘pointer-events’, các yếu tố đồ họa có thuộc tính ‘visibility’ được đặt thành ẩn vẫn có thể nhận sự kiện.

Là một công việc xung quanh bạn có thể sử dụng một trong hai display: none hoặc thêm pointer-events: none đến lớp học của bạn với visibility: hidden.

+0

Không thể tin rằng iv không bao giờ gặp phải điều này trước đây, vì vậy tôi đoán nếu spec nói rằng 'có thể' cháy , không có cách nào sai cho một trình duyệt để thực hiện nó. Cảm ơn.Để được trợ giúp – atmd

+0

* có thể * là một thuật ngữ thú vị để đưa vào thông số kỹ thuật. – Elijah

+1

Không, đó là lỗi của Firefox và bạn đang hiểu sai thông số kỹ thuật. –

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