我有一个问题。是的,我不能添加div"插入符号"到我的下拉菜单,在只有孩子的菜单上。有我的代码
$(document).ready(function(){
if ($('.mobile-menu li:has(sub-menu)'))
{
$('.mobile-menu li').parent('.ul').append('<div class=caret></div>');
}
else
{
alert('function is not working');
}
});
&#13;
/************************************************
Mobile-Menu Style
************************************************/
.mobile-show{
dispay:block;
}
.mobile-menu{
position:fixed;
width:70%;
height:100%;
background:white;
z-index:1000;
}
.mobile-menu.sub-menu{
position:absolute;
}
.mobile-menu ul{
top:10.2%;
color:black;
position:relative;
text-align:left;
font-weight:bold;
}
.mobile-menu li a {
display: block;
padding: 4% 0;
border-bottom:1px solid black;
}
.mobile-menu > ul> li:hover > a, .mobile-menu > ul> li:hover > .sub-menu > li:hover > a, .mobile-menu > ul .sub-menu .sub-menu > li:hover > a{
background-color: #111;
color: #fff;
}
.mobile-menu ul li ul{
height:100%;
width:100%;
display:none;
background:#fff;
border:none;
position:relative;
}
.mobile-menu ul li:hover ul{
display:block;
}
/************************************************
Caret Design
************************************************/
.caret {
width:100%;
height:auto;
position:relative;
border-bottom:1px solid #000;
}
.caret:before {
content:"";
border-color: #FFF transparent transparent transparent;
border-style:solid;
border-width:12px;
width:0;
height:0;
position:absolute;
bottom:-24px;
left:45%;
z-index:1020;
}
.caret:after {
content:"";
border-color: #000 transparent transparent transparent;
border-style:solid;
border-width:12px;
width:0;
height:0;
position:absolute;
bottom:-25px;
left:45%;
}
&#13;
<div class="mobile-menu">
<ul class="mobile-menu-ul">
<div class="caret"></div>
<?php wp_nav_menu(array (
'theme_location'=> 'new-menu',
'container' => '',
'items_wrap' => '%3$s'
)); ?>
&#13;
我对此非常陌生,尤其是jQuery。这就是我的菜单现在的样子:http://prntscr.com/d6txgx菜单顶部是我想要的子元素时的样子在任何菜单中。目前底部是我的代码看起来像... 我很感激任何帮助!!谢谢! :)
答案 0 :(得分:1)
如果它是正确的,您可以定位wordpress菜单类.caret
并定位/************************************************
Mobile-Menu Style
************************************************/
.mobile-show{
dispay:block;
}
.mobile-menu{
position:fixed;
width:70%;
height:100%;
background:white;
z-index:1000;
}
.mobile-menu.sub-menu{
position:absolute;
}
.mobile-menu ul{
top:10.2%;
color:black;
position:relative;
text-align:left;
font-weight:bold;
list-style: none;
padding: 0;
}
.mobile-menu li a {
display: block;
position: relative;
padding: 4% 0;
border-bottom:1px solid black;
}
.mobile-menu > ul> li:hover > a, .mobile-menu > ul> li:hover > .sub-menu > li:hover > a, .mobile-menu > ul .sub-menu .sub-menu > li:hover > a{
background-color: #111;
color: #fff;
}
.mobile-menu ul li.menu-item-has-children ul{
height:100%;
width:100%;
visibility: hidden;
opacity: 0;
transition: visibility 0s, opacity 0.5s linear;
background:#fff;
border:none;
position:relative;
}
.mobile-menu ul li.menu-item-has-children:hover ul{
display:block;
visibility: visible;
opacity: 1;
}
.menu-item-has-children > a{
border-bottom:1px solid #000;
}
.menu-item-has-children > a:before {
content:"";
border-color:#FFF transparent transparent transparent;
border-style:solid;
border-width:12px;
width:0;
height:0;
position:absolute;
bottom:-24px;
left:45%;
z-index:1020;
}
.menu-item-has-children > a:after {
content:"";
border-color:#000 transparent transparent transparent;
border-style:solid;
border-width:12px;
width:0;
height:0;
position:absolute;
bottom:-25px;
left:45%;
}
.mobile-menu ul li.menu-item-has-children:hover a:before{
border-color: transparent transparent #FFF transparent;
bottom: 0;
}
.mobile-menu ul li.menu-item-has-children:hover a:after{
border-color: transparent transparent #000 transparent;
bottom: 0;
}
上的所有css。
然后你不需要jQuery!
<div class="mobile-menu">
<ul id="menu-top-menu" class="mobile-menu-ul">
<li id="menu-item-35" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-35 dropdown">
<a title="test page" href="http://wpbasis.com/test-page/" data-dropdown="dropdown" class="dropdown-toggle" aria-haspopup="true">test page <span class="caret"></span></a>
<ul role="menu" class=" dropdown-menu">
<li id="menu-item-36" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-36">
<a title="Checkout" href="http://wpbasis.com/checkout/">Checkout</a>
</li>
<li id="menu-item-37" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-37">
<a title="Cart" href="http://wpbasis.com/cart/">Cart</a>
</li>
</ul>
</li>
</ul>
</div>
#include <stdio.h>
//Vertices represent the vertices of the graph
//Color = {W,B,G}
/*
* W = White =>Means unvisited
* B = Black =>Means visited
* G = Gray =>Means discovered
* colors and distances are stored in graph[i][0].color and graph[i][0].distance
* */
struct Vertices{
int data;
char color;
int distance;
};
struct node{
int element;
struct node *next;
};
/*
* Here we check if vertex1 is adjacent to vertex2
* Means graph[vertex1][vertex2].data !=0
* */
struct node *first = NULL;
struct Vertices graph[8][8];
int count = 0;
void enqueue(int element){
struct node *newNode,*currentNode,*prevNode;
//Create a new Node
newNode = (struct node*)malloc(sizeof(struct node));
newNode->element = element;
newNode->next = NULL;
//First node
if(first == NULL){
first = newNode;
}
//Any other node
else{
currentNode = first;
while(currentNode != NULL){
prevNode = currentNode;
currentNode = currentNode->next;
}
prevNode->next = newNode;
}
}
int dequeue(){
int element;
element = first->element;
first = first->next;
return element;
}
void displayGraph(int totalVertices){
int i,j;
printf("\nGraph");
for(i=0;i<totalVertices;i++){
for(j=0;j<totalVertices;j++){
printf("\nData = %d Color = %c Distance = %d",graph[i][j].data,graph[i][j].color,graph[i][j].distance);
}
}
}
void displayQueue(){
printf("\nQueue");
struct node *currentNode;
currentNode = first;
while(currentNode != NULL){
printf("--> %d",currentNode->element);
currentNode=currentNode->next;
}
}
int main(){
int totalVertices;
printf("\n Enter total vertices");
scanf("%d",&totalVertices);
int i,j;
for(i=0;i<totalVertices;i++){
for(j=0;j<totalVertices;j++){
printf("If %d adjacent to %d",(j+1),(i+1));
printf("\nEnter 1 if yes. O if no");
int value;
scanf("%d",&value);
graph[i][j].data=value;
}
}
for(i=0;i<totalVertices;i++){
graph[i][0].color='W';
}
printf("\nGraph input ends");
//BFS begins here
printf("\nEnter the vertex from which search begins");
int source;
scanf("%d",&source);
source = source - 1;
enqueue(source);
graph[source][0].color='G';
graph[source][0].distance=0;
printf("\nBFS traversal");
while(first != NULL){
int currentVertex = dequeue();
for(i=0;i<totalVertices;i++){
if(graph[currentVertex][i].data!=0){
if(graph[i][0].color=='W'){
graph[i][0].color='G';
graph[i][0].distance = graph[currentVertex][0].distance+1;
enqueue(i);
}
}
}
graph[currentVertex][0].color='B';
int currentVertexName = currentVertex+1;
printf("<-> %d",currentVertex);
}
return 0;
}