添加“数据悬停” WordPress的菜单项

我试图找出一种方法来“数据悬停”添加到WordPress的我的菜单项，即：添加“数据悬停” WordPress的菜单项

我要放置：

data-hover="ABOUT US"

到

<a href="#">ABOUT US</a>

而不能手动更改链接HTML本身，使之成为：

<a href="#" data-hover="ABOUT US">ABOUT US</a>

但WordPress的疯狂繁琐的使用，我无法找到一种方法来实现这个没有JavaScript。那么有人可以给我一些关于如何做到这一点的想法吗？

来源

2017-03-07 Leurus

我认为js是票据，因为你不想编辑WP核心。 –

添加到您的functions.php的主题

add_filter('nav_menu_link_attributes', 'add_custom_data_atts_to_nav', 10, 4); 
function add_custom_data_atts_to_nav($atts, $item, $args) { 

$atts['data-hover'] = $item->title; 
return $atts;}

希望这将帮助！

来源

2017-03-07 09:02:08

$(document).ready(function() { 
 
    $('a').each(function() { 
 
    $(this).attr('data-hover', $(this).text()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="#">ABOUT US</a> 
 
<a href="#">FOO BAR</a>

但我强烈建议编辑实际的观点而不是肮脏的解决方案。

来源

2017-03-07 08:11:16 Sojtin

你不是在开玩笑哈哈。它完全打破了我的滑块和其他一些东西。任何其他想法？ – Leurus

这会将数据悬停添加到文档中的每个锚点。并可以与其他JS功能发生冲突... @Leurus发生了什么 –

@ thakur.B是的，这就是为什么我建议不要使用它，Leurus没有提供更多的细节，比如想要的范围的包装容器，所以它在全球范围内为淘汰文件工作。 – Sojtin

添加“数据悬停” WordPress的菜单项

回答

相关问题