How can i make my qtip decide on his own to Left or Right tip attribute

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
         }
    });
});

Which I love wen the .tooltip item is on the right panel of my website, but if not can't see it complete,

How can I make it tooltip:'right' when it's somewhere else? I mean, how can I know?

Pearly

would be the same way i choose <div> efficient? – Pearly

whad did you edit? tags? – Pearly

excuse me? i don't know what you are talking about. if i clit edit i can only edit -no extra options for me- – Pearly

Answer 1

The solution in my similar to yours case was:

position : {
    adjust : {
        screen : true
    }
}

You may find more info in this thread: How to avoid page scroll when using qtip?

Zebadiah

This particular answer somehow hasn't done it for me, but I'm voting it up for the link to another thread with an answer which did. – Suppressive

Answer 2

I think might be first time i answer my own question,

this 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?

Pearly