{"id":28,"date":"2005-10-17T02:45:05","date_gmt":"2005-10-17T07:45:05","guid":{"rendered":"http:\/\/wahlers.com.br\/claus\/blog\/fp-85-tooltips-over-links-in-html-enabled-textfields\/"},"modified":"2006-05-22T12:34:07","modified_gmt":"2006-05-22T17:34:07","slug":"fp-85-tooltips-over-links-in-html-enabled-textfields","status":"publish","type":"post","link":"http:\/\/wahlers.com.br\/claus\/blog\/fp-85-tooltips-over-links-in-html-enabled-textfields\/","title":{"rendered":"FP 8.5: Tooltips over links in HTML enabled TextFields"},"content":{"rendered":"

If you move your mouse pointer over a hyperlink in an HTML webpage, your browser typically displays the URL in it’s status bar. In addition, if the hyperlink has a title<\/code> attribute set, a tooltip is shown with a human readable description of the linked resource.<\/p>\n

Unfortunately, with rich text used in Flash websites\/applications this is not the case. Your mouse pointer will change to a “hand-cursor”, indicating you’re hovering a hyperlink, but the status bar will stay empty, and the title attribute is ignored by Flash, making it impossible for you to find out where the hyperlink will take you without actually clicking it.<\/p>\n

With Flash Player 8.5 alpha, the behaviour of hyperlinks in rich text controls hasn’t changed (yet?), but luckily Macromedia implemented some nifty API extensions making it possible to actually find out if the user is hovering a hyperlink in a HTML enabled TextField.<\/p>\n

Here’s how it works:<\/p>\n

FP 8.5 introduces the TextField.getCharIndexAtPoint(x, y)<\/code> method, returning the index of the character in a TextField at the point (x, y).<\/p>\n

You can then get the TextFormat of the character at that index, using TextField.getTextFormat(i, i+1)<\/code>, and check it’s url<\/code> property. If set, display it in a Tooltip, or send it to Javascript via ExternalInterface to show it in the browser’s status bar. Done.<\/p>\n

Demo:<\/p>\n

http:\/\/codeazur.com.br\/stuff\/flex2\/OnHoverApp.html<\/a> (FP 8.5 required)
\nhttp:\/\/codeazur.com.br\/stuff\/flex2\/OnHoverApp.zip<\/a> (Sources)<\/p>\n

In this demo i subclassed the Flex 2 component mx.controls.Text<\/code> and use it via MXML, however you can as well use this method with normal TextFields in your Actionscript 3 projects.<\/p>\n","protected":false},"excerpt":{"rendered":"

If you move your mouse pointer over a hyperlink in an HTML webpage, your
\nbrowser typically displays the URL in it’s status bar. In addition, if
\nthe hyperlink has a title<\/code> attribute set, a tooltip is shown with
\na human readable description of the linked resource.<\/p>\n

Unfortunately, with rich text used in Flash websites\/applications this is
\nnot the case. Your mouse pointer will change to a “hand-cursor”, indicating
\nyou’re hovering a hyperlink, but the status bar will stay empty, and the title
\nattribute is ignored by Flash, making it impossible for you to find out
\nwhere the hyperlink will take you without actually clicking it – a severe
\naccessibility problem.<\/p>\n

With Flash Player 8.5, the behaviour of hyperlinks in rich text controls
\nhasn’t changed, but luckily Macromedia implemented some nifty API extensions
\nmaking it possible to actually find out if the user is hovering a hyperlink
\nin a HTML enabled TextField. Continue reading →<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-28","post","type-post","status-publish","format-standard","hentry","category-flash"],"_links":{"self":[{"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/posts\/28","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/comments?post=28"}],"version-history":[{"count":0,"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/posts\/28\/revisions"}],"wp:attachment":[{"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/media?parent=28"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/categories?post=28"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/wahlers.com.br\/claus\/blog\/wp-json\/wp\/v2\/tags?post=28"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}