[Solved] qtip-1.0.0 and IE8 problem

[seanR]

hi,

i am using asp.net 3.5 and have some checkboxes which also display a qtip callout when hovered over.

this worked very well until you browse using IE 8.

when i hover over the checkboxes now - the checkbox description disappears (but the callout still shows).
As you can see in my attachement.

the code i use to initialise qtip is below:

JS Code

function InitializeQtip() {
                $('div.checkBoxDiv td span[title]').qtip({
                    position: {
                        corner: {
                            target: 'topLeft',
                            tooltip: 'bottomLeft'
                        }
                    },
                    style: {
                        'font-size': 12,
                        name: 'green',
                        padding: '7px 13px',
                        width: {
                            max: 210,
                            min: 0
                        },
                        tip: true
                    }
                });
            }
 
$(document).ready(function() {
                InitializeQtip();
            });

   

[seanR]

anyone?

here is the html, where the description of the checkbox disapears:

HTML Code

<table id="ctl00_pageBody_trusteeCheckBoxListPartOne" class="checkBoxList" border="0">
<tr>
<td>
   <span title="A trustee chosen by the members of an occupational pension scheme.">
      <input id="ctl00_pageBody_trusteeCheckBoxListPartOne_0" type="checkbox" name="ctl00$pageBody$trusteeCheckBoxListPartOne$0" />
      <label for="ctl00_pageBody_trusteeCheckBoxListPartOne_0">Member nominated trustee</label>
   </span>
</td>
</tr>

[Craig]

Hmmm can't see why this would be occurring, the checkbox just disappears completely? Have you tried using the developer console to see if it's display property is still set to inline/block and not to none?

[seanR]

(3rd October 17:24)Craig Wrote:  Hmmm can't see why this would be occurring, the checkbox just disappears completely? Have you tried using the developer console to see if it's display property is still set to inline/block and not to none?

hi,

i fixed it by removing one line of css!

.myDiv label {
float:left;
}

this float left was somehow interacting with the jquery and ie8 - to hide the text on the label?
when i removed it it worked!