Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

manual positioning adjust on qtip tooltip (not working)

 $('#nav a[href][title]').qtip({
      content: {
         text: false // Use each elements title attribute
      },
      position: {
     corner: {
        target: 'topLeft',
        tooltip: 'middleRight'
                }
                },
     style: {
       name: 'dark',
       width: 230,
       padding: 3,
       bottom: 10,
       textAlign: 'center'
      }
 // Give it some style
   });

i would like to simulate: css: position:relative;bottom:10px so the tooltip gets vertical aligned (see image) with target, but i cant get it done

enter image description here

trying like this

$('#nav a[href][title]').qtip({
      content: {
         text: false // Use each elements title attribute
      },
      position: {
     corner: {
        target: 'topLeft',
        tooltip: 'middleRight'
                }
                },
     style: {
       name: 'dark',
       width: 230,
       padding: 3,
       position: 'relative',
       bottom: 10,
       textAlign: 'center'
      }
 // Give it some style
   });

But the text of the tooltip gets moved, not the tooltip itself,

how can i do this?

EDIT

trying the 'adjust' property but there is a syntax mistake i can't find

$('#nav a[href][title]').qtip({
      content: {
         text: false // Use each elements title attribute
      },
      position: {

      adjust: {
              x: 10px,
              y: 10px
       },

     corner: {
               target: 'topLeft',
               tooltip: 'middleRight'
                }
     },
     style: {
       name: 'dark',
       width: 230,
       padding: 3,
       textAlign: 'center'
      },
 // Give it some style
   });
like image 678
Toni Michel Caubet Avatar asked May 14 '11 15:05

Toni Michel Caubet


1 Answers

You can use "adjust" property of the "position" property group as follows:

position: {
    corner: {
        target: 'topLeft',
        tooltip: 'middleRight'
        },
    adjust: {
        x: 10,
        y: 10
        }
    }

The numbers i provided are arbitrary. You can play with them to position as you want.

like image 51
Dimitri Avatar answered Nov 03 '22 00:11

Dimitri