I am finding that tooltips are appearing a bit too close to the element that they are attached to. Is there any way of putting a few pixels of space between the tooltip and the element?

My globalOptions are:

  licenseKey: "*********",
  colorTheme: 'black',
  endTask: "loop",
  disableScroll:true,
  showNavOverlay: "once",
  shadowType: "hybrid",
  boxCornerRadius: 6,
  slideInterval: 3.5,
  doSlideshow: true,
  showOuterClose: true,
  strongTextColor: "#333333",
  overlayColor: "white",
  boxColor: "white",
  transitionDuration: 5,
  resizeDuration: 5,
  overlayOpacity: 40,
  padding: 12,
  outerBorder: 0,
  showIE6EndOfLife: true

And the relevant classOptions is:

  attachToHost:true,
  placement: "top",
  width: 300,
  padding: 12,
  outerBorderColor: "#30A097",
  boxColor: "#3AB3A9",
  contentBackgroundColor: "#3AB3A9"

I've tried removing attachToHost. That helps when the mouse is moved slowly down from above, but makes it worse when moved up from below.

Try assigning the boxTopAdjust option. For example, "boxTopAdjust:-10" will move the tooltip up 10px from its calculated display position.

Brilliant! Thanks.