[buddypress-trac] [BuddyPress Trac] #7188: Remove/Replace `title` attributes with Tooltips usable in all devices

[buddypress-trac]

#7188: Remove/Replace `title` attributes with Tooltips usable in all devices
-----------------------------+------------------
 Reporter:  mercime          |       Owner:
     Type:  enhancement      |      Status:  new
 Priority:  normal           |   Milestone:  2.8
Component:  Core             |     Version:
 Severity:  normal           |  Resolution:
 Keywords:  has-screenshots  |
-----------------------------+------------------
Changes (by mercime):

 * keywords:   => has-screenshots
 * milestone:  Future Release => 2.8


Comment:

 In the first demo, we add extra markup and attributes to the elements
 where we want to show tooltips like so:

 {{{
 <p>Link: Admin created the group BP Nouveau <a href="#link-to-page" class
 ="bp-tooltip">
 <span class="time-since">1 week, 3 days ago<span class="bp-tooltip-text"
 role="tooltip">View Discussion</span></span></a></p>
 }}}


 An alternative demo at http://codepen.io/mercime/pen/vygMEg just adds a
 `class`, `aria-label` (where needed) and `data-bptooltip` attributes to
 the elements to do the same:

 {{{
 <p>Link: Admin created the group BP Nouveau <a href="#link-to-page" class
 ="bp-tooltip" data-bptooltip="View Discussion" aria-label="View
 Discussion">
 <span class="time-since">1 week, 3 days ago</a></p>
 }}}


 Both demos require JS for removing the tooltip after touch ends for
 mobile.

--
Ticket URL: <https://buddypress.trac.wordpress.org/ticket/7188#comment:8>
BuddyPress Trac <http://buddypress.org/>
BuddyPress Trac