Creo que el problema surge de la incompatibilidad entre las nuevas versiones de qTip y jQuery.
He pasado el último código de prueba de hora con qTip para tratar de averiguar por qué mi código se negó a funcionar y después de mirar el forums para ver si podía encontrar problemas similares me di cuenta de que el siguiente código thread funciona a la perfección, pero si se intercambia con una versión más nueva de jQuery produce un error.
<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>
He descargado jQuery 1.3.2 from the Google Code website y este ejemplo ahora funciona perfectamente para mí. Pronto comenzaré a adaptar este código a mis necesidades para ver si hay algún otro problema, pero para cualquiera que todavía tenga este problema, espero que esta publicación sea útil.
EDIT: Parece que se trata de un problema de incompatibilidad de versiones. Este código simple del sitio web de documentación funciona perfectamente ahora con estas mismas versiones. ¡Espero que esto te ayude!
<!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: Hay una nueva versión de QTIP en las obras por lo que puede valer la pena la espera de que, sin embargo, si desea utilizar QTIP con la última versión de jQuery entonces usted puede descargar uno de el nightly builds para qTip. Utilizando el ejemplo anterior intercambié ambas secuencias de comandos para la última jQuery (1.4.2) con la última versión nocturna y parece que funciona.
Acabo de llegar a esta página después de intentar que este complemento funcione y seré el primero en decir que la documentación no está tan bien escrita como parece pensar. de lo contrario, no habría necesidad de escribir esta pregunta. –
Totalmente de acuerdo con EnderMB. Lo que es obvio para uno no es necesariamente para todos. La documentación en el sitio de qtip no está clara para mí. No hay un ejemplo simple con un código completo de fácil acceso. – tucson
Si intenta seguir esta muestra de esquinas redondeadas, es imposible hacer que funcione: http://craigsworks.com/projects/qtip2/tutorials/styling/#corners –