I am using some jquery which applies an overlay on an image on hover. The script uses content from the image’s title attribute to display over the image. When I tested this locally, it seemed to work, and I could style the text within title="" however, I’m now trying to get it working in WordPress, and it doesn’t seem to let me style the text within the title attribute.
<img src="https://wordpress.stackexchange.com/questions/200024/img.png" title="<h1>Title heading</h1><hr><h2>Title sub heading</h2>"
1 Answer
First of all i’d recommend you stop using title attribute for html container purpose:
Image title (and the element name speaks for itself) should provide
additional information and follow the rules of the regular title: it
should be relevant, short, catchy, and concise (a title “offers
advisory information about the element for which it is set“). In
FireFox and Opera it pops up when you hover over an image
In order to get things works you can use data- attribute (very good “intermediate” article about data-attribute with example how to use)
Considering [Can data-* attribute contain HTML tags?] it’s valid to use data- attributes with HTML, and, as recommended under the refference above – take into account character escape.
