Question

I hope this doesn’t seem too opaque:

I’m using jqPlot to make a bar graph. Along the x-axis of the graph, I’m trying to make it so that when you hover over each bar’s label, it will show more information on the bar.

However, it seems these labels are “covered” by the canvas tag, and the browser won’t recognize me hovering over the elements. I’ve tried a title on a span, and the jquery mouseover. Nothing. It’s there, it could be hovered over, but it’s just being considered “under” by the canvas. Any solutions?

HTML by request… bit ugly:

<div class="jqplot-axis jqplot-xaxis" style="width: 960px; height: 15px; left: 0px; bottom: 0px; position: absolute; ">
<div class="jqplot-xaxis-tick" style="position: absolute; left: 24.88095238095238px; ">
<span class="testhov" style="z-index: 999;">NE</span>
</div></div>

Answer 1

For z-index to work the element must be positioned. This means that you need to add position:relative, position:absolute or position:fixed to your style on the .testhov span. I think you would want to add position:relative.

https://developer.mozilla.org/en/CSS/z-index