Hide default title tooltip

Question

We can see above images, on hover of "create" button, two tooltips are coming. here I dont want default tooltip (small one below).

I want to show only my customize tool tip

My Code:

<style>
button[title]:hover:before {
  content: attr(title);
  padding: 2px 2px;
  color: #333;
  position: absolute;
  left: 100px;
   top: 320px; 
  z-index: 20;
  white-space: nowrap;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -moz-box-shadow: 0px 0px 4px #222;
  -webkit-box-shadow: 0px 0px 4px #222;
  box-shadow: 0px 0px 4px #222;
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #eeeeee),color-stop(1, #cccccc));
  background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
  background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
}
  </style>

<button onclick="setActionAndSubmit('id_form_workitem_create', 'create');" title="please fill all mandatory fields">
           Create
</button>

Please help, thanks in advance

http://stackoverflow.com/questions/19746767/hide-title-from-tooltip — sinisake, Aug 19 '15 at 18:04

score 2 · Accepted Answer · answered Aug 19 '15 at 18:16

2

The small tooltip that appears is being displayed because you set the title attribute in your DOM node. In the following JSFiddle, the solution proposed is to change the attribute that holds the tooltip content in the button and in the CSS.

JSFiddle

answered Aug 19 '15 at 18:16

Guilherme Fujiyoshi

471
3
11

score 0 · Answer 2 · answered Aug 19 '15 at 18:04

0

The one that you want to take out is coming from your title attribute - if you remove that attribute it'll get rid of it, but you'll have to change your selector and hard-code your content, since both of those are relying on the title being there.

answered Aug 19 '15 at 18:04

dgavian

250
2
10

Hide default title tooltip

2 Answers2