工具提示在IE 10中显示实际值之前显示黑色块

Question

这个小提琴中的工具提示在chrome中都很好用，但在IE10中显示实际值之前它会显示黑色块。

Here's the fiddle

这是我用来创建工具提示的代码

<table class="table table-bordered datatable">
    <thead class="table-head">
      <tr>
        <th>No</th>
        <th>Code Point</th>
        <th>Reference</th>
        <th>Character</th>
        <th>Text</th>
        <th>Description</th>
      </tr>
    </thead>
    <tbody>
      {% for x in data_code %}
      <tr class="table-row">
        <td>{{ forloop.counter }}</td>
        <td><label>{{ x.0 }}</label></td>
        <td><input id="codepoint_input" type="text" value={{x.2}} size=3 title="Text"></td>
        <td><label> {{x.3}}</label></td>
        <td>{{x.4}}</td>
      </tr>
      {% endfor %}
    </tbody>
  </table>

这是我用于工具提示的风格

   .on('mouseover', function(d) {
    tooltip.transition()
        .style('opacity', 1.0)
        .style('background', 'white')
        .style('display','block')


    tooltip.html( d.global )
        .style('left',(d3.event.pageX - 35) + 'px')
        .style('top', (d3.event.pageY - 30) + 'px')
})
.on('mouseout', function(d) {
    tooltip.transition()
        .style('opacity', 1)
        .style('display','none')
})

Answer 1

我删除了

.style('background', 'white')

来自tooltip.transition的

，因为'background-color'属性始终存在于tooltip类中;它现在工作正常。