wordpress上面如何在导航栏上面添加子分类

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了wordpress上面如何在导航栏上面添加子分类相关的知识,希望对你有一定的参考价值。

添加分类目录,让后将分类目录添加到主菜单即可。追问

但是我按照这个做了之后,在网站上面还是没有显示出来

参考技术A 在wordpress后台添加子分类,子分类的html结构是一定的,可以使用jquery控制

参考该篇文章:http://www.tennfy.com/484.html
参考技术B 直接拉到父菜单下面即可

如何在导航上添加悬停过渡效果?

【中文标题】如何在导航上添加悬停过渡效果?【英文标题】:How to add a hover transition effect on the navigation? 【发布时间】:2013-10-12 20:07:34 【问题描述】:

我正在就特定问题提出特定问题,但我不知道该怎么做,但想将其添加到我的网站。

1) 当父 li 有一个孩子时,我希望该导航保持悬停状态,并在通过子元素时应用效果。现在,当我不再悬停在它上面时,当我希望父 li 在通过子导航时仍然具有悬停效果时,它将失去悬停效果并在子元素上应用悬停效果。

2) 我不知道该怎么做的另一件事是当我将鼠标悬停在任何导航链接上时的过渡效果,当鼠标悬停进出时,它会有一种淡入淡出的效果。我该怎么做?

我试图这样做:

CSS:

#nav li:hover > ul /*display sub menus when hovered over*/
    left:0; /*show menu when hovered*/
    z-index:100; /*places the sub nav in frontier of all elements*/
    transition: all 2.4s ease-in-out -2s; /*transition: property duration timing-function delay;*/
    -moz-transition: all 2.4s ease-in-out -2s;
    -webkit-transition: all 2.4s ease-in-out -2s;

它带来了出乎意料但很酷的结果,子菜单向右滑动。这不是我想要的,但没关系。我只是想应用其他两个功能,但不知道在哪里看。我的完整代码在这里:jsfiddle nav code

【问题讨论】:

【参考方案1】:

显示DEMO Transition

#nav a:hover 
    transition: ease-in-out all .4s; 
    -moz-transition: ease-in-out all .4s;
    -webkit-transition: ease-in-out all .4s;
    background-color:#000000;
    color:#FFFE41;
    text-decoration:none;
    font-weight:bold;

【讨论】:

正是我想要的。谢谢!但我有个问题。我注意到您的转换语法与我在计时函数之后放置转换属性的语法不同。进行过渡时的顺序是否重要,比如它会影响动画的结果吗? 欢迎您!是的.. 阅读 this question in SO 来解决您的所有问题,以及有关转换属性的更多示例,请查看:Using_CSS_transitions!祝你好运并享受它! :)【参考方案2】:

我编辑了您的代码,将left 属性更改为opacity 并再添加一个transition。看一看:http://jsfiddle.net/YfuDT/

关于你问题的第 1 部分,恐怕你不会用 css 实现它,需要一些 javascript。

【讨论】:

以上是关于wordpress上面如何在导航栏上面添加子分类的主要内容,如果未能解决你的问题,请参考以下文章

对比两个文件里面的代码不同,并找出相关的不同代码的位置天坑之前端页面导航栏上面空白问题

iOS 导航栏-返回按钮-自定义

在 wordpress 的导航菜单中添加搜索栏

iOS导航栏的正确隐藏方式

向导航栏项添加文本

iOS导航栏的正确隐藏方式