为二级菜单的父级添加三角箭头 —— 这个效果老早就想折腾了,之前没有学jQuery,现在会一点,实现起来也很简单。
比如WP的某些菜单是有二级下拉菜单的,这时最好给这些菜单加一个指示箭头,让访客知道这个菜单下还有下拉二级菜单,体验较好。
这个箭头主要附加在父级菜单的a标签上,用在li上也可以,但不好调整,也就是用到简单的节点定位伪类after,下面是代码

JS代码
$(function() { // 子菜单父级三角箭头
    $('.nav').find('.dropdown-menu').siblings('a').addClass('arrow'); //.dropdown-menu是二级菜单的类
});
CSS代码
.arrow:after{font-family:'FontAwesome';content:"\f0dd";display:inline-block;color:#fff;float:none;position:relative;top:-3px;left:4px;}

这里用到FontAwesome字体图标,可以从网上下载。