Search code examples
jquerycsspositionqtip

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

Solution

  • 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.