// Create the tooltips only on document load
$(document).ready(function() {
	
   // By suppling no content attribute, the library uses each elements title attribute by default
   $('#nav a[href][title]').qtip({
      content: {
         text: false // Use each elements title attribute
      },
      position: {
      corner: {
         target: 'bottomMiddle',
         tooltip: 'topMiddle'
      }
   },
      style: { 
      width: 150,
      padding: 5,
      background: '#fff',
      color: '#666',
      textAlign: 'center',
      border: {
         width: 1,
         radius: 2,
         color: '#ccc'
      },
      tip: { // Now an object instead of a string
         corner: 'topMiddle', // We declare our corner within the object using the corner sub-option
         color: '#666',
         size: {
            x: 8, // Be careful that the x and y values refer to coordinates on screen, not height or width.
            y : 6 // Depending on which corner your tooltip is at, x and y could mean either height or width!
         }
},

   }
   });
   
});