views:

104

answers:

1

Hi, not sure if i'm set things up incorrectly - I don't seem to see anyone else with this problem, but my qTip popups (all ajax loaded content) are loading quite erratically, in that they are often animating in from off screen before appearing in the correct position. Is there a simple solution to this which I may have missed? Thanks again for your help.

HTML markup:

    <span class="formInfo">
   <a href="http://localhost/httpdocs/index.php/help/kc_dob" class="jTip" name="" id="dob_help">?</a>
</span>

qTip initialisation..

    //set up for qtip
   function initQtip()
   {
         $('a.jTip').each(function()
            {
               $(this).qtip(
               {
                 content: {
                     // Set the text to an image HTML string with the correct src URL to the loading image you want to use
                     text: '<img src="/media/images/wait.gif" alt="Loading..." />',
                     url: $(this).attr('href') // Use the rel attribute of each element for the url to load
                  },
                  position: {
                     adjust: {
                           screen: true // Keep the tooltip on-screen at all times
                     }
                  },
                  show: { 
                  when: 'click', 
                     solo: true // Only show one tooltip at a time
                  },
                  hide: 'unfocus',
                  style: {
                     tip: true, // Apply a speech bubble tip to the tooltip at the designated tooltip corner
                     border: {
                           width: 10,
                           radius: 10
                     },
                  width: {
                     min: 200, 
                     max: 500
                  },
                     name: 'light' // Use the default light style
                  }
               });
            //prevent default event on click
            }).bind('click', function(event){ event.preventDefault(); return false; });
      }
A: 

See if doing this helps:

show: { delay: 0, effect: { type: 'fade', length: 0 } }
Ben McIntosh