How can I make my qtip decide independently to the left or right attribute of the tooltip

Question

$('a.tooltip').each(function(){ $(this).qtip({ content: { url: 'includes/qtip.php?'+$(this).attr('rel')+' #'+$(this).attr('div'), text:'loading...' }, show: { delay: 400}, hide: { fixed: true, delay: 200 }, position: { corner: { target: 'bottomLeft', tooltip: 'right' } }, style: { name: 'light', width: 700 } }); }); 

As I love wen, the .tooltip element is in the right pane of my website, but if it cannot see it,

how can i do this tooltip:'right' when it is somewhere else? I mean, how can I know?

Answer 1

The solution in my case, similar to your case:

 position : { adjust : { screen : true } } 

You can find more information in this thread: How to avoid page scrolling when using qtip?

Answer 2

I think the first time I will answer my question,

it works,

 $('#panel_derecho a.tooltip').each(function(){ $(this).qtip({ content: { url: 'includes/qtip.php?'+$(this).attr('rel')+' #'+$(this).attr('div'), text:'loading...' }, show: { delay: 400}, hide: { fixed: true, delay: 200 }, position: { corner: { target: 'topLeft', tooltip: 'middleRight' } }, style: { name: 'light', width: 700 } }); }); $('#router a.tooltip').each(function(){ $(this).qtip({ content: { url: 'includes/qtip.php?'+$(this).attr('rel')+' #'+$(this).attr('div'), text:'loading...' }, show: { delay: 400}, hide: { fixed: true, delay: 200 }, position: { corner: { target: 'topLeft', tooltip: 'left' } }, style: { name: 'light', width: 700 } }); }); 

Can I optimize it?