I was given a simple project of displaying images with a mouseover event using jquery. The goal is to display a qtip only if it is mousedover, beforehand it bound all of them on load and it was really slow. They use qtip 1.0 and I run into a 'Too much recursion error' and I'm having trouble identifying where the recursion occurs. I did some research and it may have something to do with event bubbling but haven't been able to fix it yet.
$(document).ready(function(){
$( ".employee" ).hover(function(event) {
event.stopPropagation();
var content = '<img src="/upload_test/';
<!-- content += $(this).attr('id'); -->
content += 'test.jpg';
content += '" alt="Loading thumbnail..." height="202" width="254" />';
$("#" + event.target.id).qtip(
{
content: content,
position: {
corner: {
tooltip: 'leftTop',
target: 'leftTop'
}
},
style: {
height:202,
width:280,
border: {
width: 7,
radius: 5,
color: 'black'
}
// Give it a speech bubble tip with automatic corner detection
},
hide: { fixed: true, delay: 1000 }
});
});
});
Meh, the problem was that I didn't read the manual properly and implemented it incorrectly. Everything is fine now.