Ответ 1
Я считаю, что проблема связана с несовместимостью между новыми версиями qTip и jQuery.
Я провел последний час, проверив код с qTip, чтобы попытаться выяснить, почему мой код отказался работать и после просмотра forums чтобы увидеть, могу ли я найти похожие проблемы, я заметил, что следующий код в потоке работает отлично, но если он поменяется новой версией jQuery, он выдает ошибку.
<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>
Я загрузил jQuery 1.3.2 с сайта Google Code, и этот пример теперь отлично работает для меня. Я скоро начну адаптировать этот код к моим потребностям, чтобы увидеть, есть ли какие-либо другие проблемы, но для тех, кто все еще страдает этой проблемой. Я надеюсь, что этот пост полезен.
EDIT: Похоже, что это проблема несовместимости версии. Этот простой код с сайта документации теперь отлично работает с этими же версиями. Надеюсь, это поможет вам!
<!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>
РЕДАКТИРОВАТЬ 2: В работе есть новая версия qTip, поэтому стоит подождать, но если вы хотите использовать qTip с последней версией jQuery, вы можете скачать один ночные сборки для qTip. Используя приведенный выше пример, я поменял оба сценария для последнего jQuery (1.4.2) с помощью новейшей ночной сборки и, похоже, работает.