将此代码添加到函数中。php
class Tooltips_Walker extends Walker_Nav_Menu
{
function start_el(&$output, $item, $depth, $args)
{
$classes = empty ( $item->classes ) ? array () : (array) $item->classes;
$class_names = join(
\' \'
, apply_filters(
\'nav_menu_css_class\'
, array_filter( $classes ), $item
)
);
! empty ( $class_names )
and $class_names = \' class="\'. esc_attr( $class_names ) . \'"\';
$attributes = \'\';
if(strstr($class_names, \'tooltips\')) {
$attributes = \' class="tooltips"\';
}
$class_names = str_replace(\'tooltips\', \'\', $class_names);
$output .= "<li id=\'menu-item-$item->ID\' $class_names>";
! empty( $item->attr_title )
and $attributes .= \' title="\' . esc_attr( $item->attr_title ) .\'"\';
! empty( $item->target )
and $attributes .= \' target="\' . esc_attr( $item->target ) .\'"\';
! empty( $item->xfn )
and $attributes .= \' rel="\' . esc_attr( $item->xfn ) .\'"\';
! empty( $item->url )
and $attributes .= \' href="\' . esc_attr( $item->url ) .\'"\';
// insert description for top level elements only
// you may change this
$description = ( ! empty ( $item->description ) and 0 == $depth )
? esc_attr( $item->description ) : \'\';
$title = apply_filters( \'the_title\', $item->title, $item->ID );
$item_output = $args->before
. "<a $attributes title=\'".$description."\'>"
. $args->link_before
. $title
. \'</a> \'
. $args->link_after
. $args->after;
// Since $output is called by reference we don\'t need to return anything.
$output .= apply_filters(
\'walker_nav_menu_start_el\'
, $item_output
, $item
, $depth
, $args
);
}
}
并更新此wp\\u nav\\u菜单代码,其中从主题[header.php]调用菜单
wp_nav_menu(
array (
\'menu\' => \'main-menu\',
\'container\' => FALSE,
\'container_id\' => FALSE,
\'menu_class\' => \'\',
\'menu_id\' => FALSE,
\'walker\' => new Tooltips_Walker
)
);
并将“tooltips”(工具提示)用作菜单项类,并将描述显示为提示标题。
并确保“Zebra\\u Tooltip”Css类z索引大于所有元素的z索引:或者以样式添加此Css代码。css
.Zebra_Tooltip{ z-index: 100000 !important;}