Hi all, First, please excuse my english;-)
I am completely new to javascript and jquiery. I discovered all this last week and I am trying to use some cool stuff in a new website project. The tooltip plugin fits perfectly to the project's design and you could see it in action here: http://www.mayorbeusch.ch/cms/ (roll over the pictures, works well in FF, not tested at all so far in IE...) My problem is: I absolutely want the tooltip with this design, and above the mouse; but when you size up the font, the tooltip get logically bigger, and start blinking... Bad. Any advice to get this fixed? Is it possible to adjust "in real time" the offset/position of the tooltip according to its size? Thank you in advance for you time and help. Olivier PS: my bit of code: $(function() { $("a.architecture").tooltip({ track:true, showURL: false, extraClass: "tooltip_architecture", fixPNG: true, }) $("a.urbanisme").tooltip({ track:true, showURL: false, extraClass: "tooltip_urbanisme", fixPNG: true, }) $("a.amenagement").tooltip({ track:true, showURL: false, extraClass: "tooltip_amenagement", fixPNG: true, }) }); and the css: #tooltip{ position: absolute; z-index: 3000; } #tooltip h3{ color: #fff; font-size:1.3em; font-family: Arial Rounded MT, Arial, sans-serif; font-weight:normal; width:286px; position:relative; bottom:122px; right:43px; padding-top:10px; padding-bottom:45px; padding-left:10px; padding-right:10px; } #tooltip.tooltip_architecture h3{ background:url(uploads/images/template/mb_tooltip_archi.png) no- repeat; background-position:left bottom; } #tooltip.tooltip_urbanisme h3{ background:url(uploads/images/template/mb_tooltip_urbanisme.png) no- repeat; background-position:left bottom; } #tooltip.tooltip_amenagement h3{ background:url(uploads/images/template/mb_tooltip_amenagement.png) no- repeat; background-position:left bottom; }
