Search code examples
javascriptjqueryjquery-pluginsqtip

Why doesn't qTip tooltip stay open so I can click link on it?


Here is my example in jsfiddle, hover over Minnesota to see the qtip popup. I am using qTip jquery plugin and I am getting stuck on making the qtip stay around long enough for someone to click the link on the tooltip. I have tried all kinds on scenerios to make it stay open. Reading the documentation it seems to be easy to do so but I tried these and no luck. I tried these

hide: { when: 'mouseout', fixed: true }

and

hide: { fixed: true, delay: 1000 }

and many others and nothing will keep the tooltip up so the user can click on a link. The thing that is irritating is that on the reference page. If you click on any of the example links they are doing exactly what i want to do and i went to the source and if seems that they are using

  hide: 'unfocus',

and

     hide: {
        fixed: true,
        delay: 240
     },

but I tried both and the tooltip won't stay open. Am I missing something?


Solution

  • Since it appears the position of your tip is off to the right some, try this:

      $(this).qtip(
      {
          hide:{ //moved hide to here,
            delay:500, //give a small delay to allow the user to mouse over it.
            fixed:true
          },
         content: $("." + test).html(),
         style: {
            name: 'dark',
             style: {
                border: 1,
                cursor: 'pointer',
                padding: '5px 8px',
                name: 'blue'
             },
            border: {}, 
            tip: true // Apply a tip at the default tooltip corner
         }
      });
    

    Updated fiddle.