Je crois que le problème vient d'une incompatibilité entre la nouvelle qTip versions et jQuery.
J'ai passé la dernière heure de tests de code avec qTip pour essayer de trouver pourquoi mon code a refusé de travailler et après avoir cherché dans les forums pour voir si je pouvais trouver des problèmes similaires, j'ai remarqué que le code suivant dans le thread fonctionne parfaitement, mais si c'est remplacée par une version plus récente de jQuery, il se produit une erreur.
<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery.qtip-1.0.0-rc3.min.js"></script>
<script type="text/javascript">
$( document ).ready( function( ) {
$.fn.qtip.styles.tooltipDefault = {
background : '#132531',
color : '#FFFFFF',
textAlign : 'left',
border : {
width : 2,
radius : 4,
color : '#C1CFDD'
},
width : 220
}
// we are going to run through each element with the classRating class
$( '.classRating' ).each( function( ) {
var rating = $( this ).attr( 'rating' );
// the element has no rating tag or the rating tag is empty
if ( rating == undefined || rating == '' ) {
rating = 'I have not yet been rated.';
}
else {
rating = 'The rating for this is ' + rating + '%';
}
// create the tooltip for the current element
$( this ).qtip( {
content : rating,
position : {
target : 'mouse'
},
style : 'tooltipDefault'
} );
} );
} );
</script>
</head>
<body>
<div id="SomeID1" class="classRating" rating="73">I have a rating</div>
<div id="SomeID2" class="classRating" rating="66">I have a rating</div>
<div id="SomeID3" class="classRating" rating="">I have a rating but it is empty</div>
<div id="SomeID4" class="classRating">I dont have a rating</div>
</body>
</html>
J'ai téléchargé jQuery 1.3.2 depuis le Google Code site et cet exemple fonctionne à la perfection pour moi. Je vais bientôt commencer à adapter ce code à mes besoins pour voir si il y a d'autres problèmes, mais pour ceux qui sont encore en souffrance à ce problème j'espère que ce post est utile.
EDIT: on dirait que C'est un problème d'incompatibilité de version. Ce simple code à partir de la documentation du site fonctionne parfaitement maintenant, avec ces mêmes versions. Espérons que cela est utile pour vous!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<a href="#" title="Hello World" class="example">Test</a>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery.qtip-1.0.0-rc3.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// By suppling no content attribute, the library uses each elements title attribute by default
$('a[href][title]').qtip({
content: {
text: false // Use each elements title attribute
},
style: 'cream' // Give it some style
});
// NOTE: You can even omit all options and simply replace the regular title tooltips like so:
// $('#content a[href]').qtip();
});
</script>
</body>
</html>
EDIT 2: Il y a une nouvelle version de qTip dans les œuvres de sorte qu'il peut être la peine d'attendre pour que, toutefois, si vous souhaitez utiliser qTip avec la dernière version de jQuery, vous pouvez télécharger l'un des nightly builds pour qTip. En utilisant l'exemple ci-dessus, j'ai troqué les deux scripts pour la dernière jQuery (1.4.2) avec la dernière nightly build et il semble fonctionner.