在移动设备上显示缩写和缩写

我经常在我的网站上使用abbr（以前是缩写）标签。但是我注意到该标签在移动/平板设备（触摸设备）上不起作用。所以我的问题是：如何使它起作用？

我在互联网上搜索了一些解决方案，但它们并不完全有用：

解决方案1：

abbr[title]:after
{
   content: " (" attr(title) ")";
}

@media screen and (min-width: 1025px)
{
   abbr[title]
   {
      border-bottom: 1px dashed #ADADAD;
      cursor:help;
   }

   abbr[title]:after
   {
      content: "";
   }
}

解决方案2：

if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) { $('abbr').each(function() { $(this).click(function() { alert($(this).attr('title')); }); }); }

他们都不满意！因此，非常感谢一些替代方案！