// Create the tooltips only on document load
$(document).ready(function() 
{
   // Notice the use of the each method to gain access to each element individually
   $('#content_Url a').each(function()
   {
      // Create image content using websnapr thumbnail service
      var content = '<img src="http://images.websnapr.com/?url=';
      content += $(this).attr('href');
      content += '" alt="Loading thumbnail..." height="152" width="202" />';
      
      // Setup the tooltip with the content
      $(this).qtip(
      {
         content: content,
         position: {
            corner: {
               target: 'rightMiddle', // Position the tooltip above the link
               tooltip: 'leftMiddle'
            },
            adjust: {
               screen: true // Keep the tooltip on-screen at all times
            }
         },
        show: { 
            when: 'mouseenter', 
         		effect: {type: 'fade', length: 300},
            solo: true // Only show one tooltip at a time
         },
         hide: {
         	effect: {type: 'fade', length: 300},
         	when: {event: 'unfocus', event: 'mouseout'},
         	delay: 1000,
         	fixed: true
         },
         style: {
            tip: true, // Apply a speech bubble tip to the tooltip at the designated tooltip corner
            border: {
               width: 0,
               radius: 3
            },
            name: 'cytiva', // Use the default light style
            width: 250 // Set the tooltip width
         }
      });
   });
});
