Ẩn thẻ tiêu đề khi di chuột

Question

Tôi đã xem qua các câu hỏi trước và không có câu hỏi nào trong số đó thực sự hiệu quả đối với tôi, tôi đã kiểm tra google và thông tin tôi thấy có vẻ khá mơ hồ, vì vậy tôi nghĩ mình nên thử ở đây.

Có ai biết/hoặc giải quyết được vấn đề về thẻ tiêu đề hiển thị khi di chuột hay không. Tôi có một loạt các liên kết và hình ảnh sẽ được chỉ định thẻ tiêu đề, tuy nhiên, một số người trong số họ sẽ hiển thị thông tin sẽ tốt hơn không bật lên trên di chuột.

Có chức năng toàn cục nào tôi có thể sử dụng để áp dụng điều này cho tất cả các cách của thẻ tiêu đề không? Ví dụ như sau:

<a href="service.php" title="services for cars" /> 

Nếu có thể, tôi muốn tắt "dịch vụ từ ô tô" xuất hiện trên di chuột.

Xin cảm ơn một lần nữa.

Answer 1

này nên chỉ làm việc tốt để vô hiệu hóa tiêu đề duy nhất:

<a href="service.php" title="services for cars" onmouseover="this.title='';" /> 

Nếu quý vị cần danh hiệu sau đó, bạn có thể khôi phục lại nó:

<a href="service.php" title="services for cars" onmouseover="this.setAttribute('org_title', this.title'); this.title='';" onmouseout="this.title = this.getAttribute('org_title');" /> 

Bằng cách này là không chung mặc dù .. có nó áp dụng cho tất cả các neo, có mã JavaScript như vậy:

window.onload = function() { 
    var links = document.getElementsByTagName("a"); 
    for (var i = 0; i < links.length; i++) { 
     var link = links[i]; 
     link.onmouseover = function() { 
      this.setAttribute("org_title", this.title); 
      this.title = ""; 
     }; 
     link.onmouseout = function() { 
      this.title = this.getAttribute("org_title"); 
     }; 
    } 
}; 

Live test case.

Edit: để áp dụng tương tự cho nhiều thẻ (ví dụ <img>) đầu tiên di chuyển cốt lõi của mã để một hàm:

function DisableToolTip(elements) { 
    for (var i = 0; i < elements.length; i++) { 
     var element = elements[i]; 
     element.onmouseover = function() { 
      this.setAttribute("org_title", this.title); 
      this.title = ""; 
     }; 
     element.onmouseout = function() { 
      this.title = this.getAttribute("org_title"); 
     }; 
    } 
} 

Sau đó thay đổi mã để:

window.onload = function() { 
    var links = document.getElementsByTagName("a"); 
    DisableToolTip(links); 
    var images = document.getElementsByTagName("img"); 
    DisableToolTip(images); 
}; 

Answer 2

Bạn có thể' t vô hiệu hóa chúng vì một phần chung của trình duyệt/đặc tả html. Nhưng tôi biết rằng bạn có thể tạo kiểu cho chúng bằng cách sử dụng css và javascript, vì vậy một màn hình hiển thị: không có gì đúng cách sẽ có thể được sử dụng ở đâu đó.

nhìn here

Answer 3

Nếu lập luận của bạn cho việc sử dụng từ khóa 'danh hiệu' là dành cho Aria tuân thủ, sử dụng aria-nhãn để thay thế.

<a href="service.php" aria-label="services for cars" /> 

Answer 4

Hãy thử đặt hai danh hiệu, là một sản phẩm nào đó sẽ được chọn bởi các trình duyệt như tooltip và sau đó là một trong những bạn cần:

<a href="service.php" title="" title="services for cars" /> 

Answer 5

Mặc dù điều này đã được trả lời trong tiêu chuẩn JS.

Đây là giải pháp jQuery.

$('a').hover( 
    function() { 
     $(this).attr("org_title", $(this).attr('title')); 
     $(this).attr('title', ''); 
    }, function() { 
     $(this).attr('title', $(this).attr("org_title")); 
    } 
); 

Answer 6

Một lựa chọn đơn giản là sử dụng CSS trên thùng của hình ảnh (div hoặc a):

pointer-events: none; 
cursor: default;