First off, thanks for this great module. You say that hovertips can be implemented in three ways; namely: 

 *  <p>blah blah blah 
 *  <span>important term</span>
 *  <span class="hovertip">text that appears.</span> 
 *  blah blah blah</p>
 *  
 *  or,
 *  
 *  <p>blah blah blah 
 *  <span hovertip="termdefinition">important term</span>
 *  blah blah blah</p>
 *  <div id="termdefinition" class="hovertip"><h1>term definition</h1><p>the term means...</p></div>
 *  
 *  or, 
 *  
 *  <p>blah blah blah 
 *  <span id="term">important term</span>
 *  blah blah blah</p>
 *  <div target="term" class="hovertip"><h1>term definition</h1><p>the term means...</p></div>

Unfortunately, only the first method here is valid xhtml, and it doesn't appear to work with divs (only spans). Can you please make a valid xhtml method that works with divs?

Thanks a lot,

Jordan

Comments

leeglasby’s picture

leeglasby commented

subscribing to this, I like this module but unfortunately it isn't xhtml valid

asb’s picture

asb commented

subscribing

greggles’s picture

greggles
he/him
Primary language English
Location Denver, Colorado, USA
commented
Title: Invalid xhtml » Make hovertip work with divs in addition to spans
Category: support » feature

More direct statement of title.

tcbun’s picture

tcbun commented

Yes, can you please update hovertip to work with divs.

HylkeVDS’s picture

HylkeVDS commented

I think the first div-one makes the most sense, as the definition is the one that should appear only once, and thus have the id. The link to the definition can then be used multiple times on a page.

<p>blah blah blah 
<span hovertip="termdefinition">important term</span>
blah blah blah</p>
<div id="termdefinition" class="hovertip"><h1>term definition</h1><p>the term means...</p></div>

I suppose the only way to do it in a valid way is use something like

<span class="hovertip_termdefinition">important term</span>

The behaviour can then be attached to everything that has a class that starts with hovertip ( $("*[class^=hovertip]") or $("*[class*=hovertip]") ), and the javascript can figure out which termdefinition to use later.

giorgosk’s picture

giorgosk
Location Chios, Greece 🇬🇷
commented

a span can be made a div with some css rules
span{display:block;}
and maybe some others

just a thought