Question

我正在寻找一个独特问题的解决方案。我在为多站点构建开发的主题的“网络菜单”下面有一个wp_menu。菜单中央有一个小环，用于存放徽标，我很好奇是否有办法获得透明列表项来容纳该位置，并允许所有其他“合法”列表项包围，所以向左或向右。

我已经有一个过滤器，可以插入一个我可以通过添加css自定义的列表项，我只是不知道如何制作一个列表项，特别是保存圆所在的位置。

该网站是： http://www.mountainjackscreative.com/sandbox/edts/sample-page/

任何帮助，甚至只是想法都会很棒！

谢谢大家。

Answer 1

由于你正在使用jQuery，你可以在菜单上做一些数学运算。

编辑：在结束标题之前加上

LAST_EDIT：这是JS小提琴http://jsfiddle.net/BsnFW/14/。最后一次尝试：）

$(document).ready(function() {

    menuBreakPoint = 200; //width in px after which you want to insert the space (experiment with this)
    menuWidth = 0;
    rightMenuStart = 600; //width in px from left of menu container div to the right


    $('.sub_site_menu li').each( function() {
        menuWidth += $(this).width();
    if (menuWidth >= menuBreakPoint) {
       $(this).css('margin-left', (rightMenuStart - menuWidth));
       return false; //break out of each loop
    }
    });

});

使用此功能。

Answer 2

你能不把这个名单分成两部分吗？向左和向右浮动一个。提供适当的ul边距，以便徽标上没有任何内容？

Answer 3

我将使用jquery解决方案，因为它最有可能在所有浏览器中呈现最佳结果。但我确实偶然发现了其他关于即将在CSS3中实现的功能的资源

包含一个强制与新CSS3＆＃34;列相容的脚本＆＃34;功能。

http://www.csscripting.com/css-multi-column/

水平wordpress菜单中心的空间

3 个答案: