简体   繁体   English

我在wordpress中的nivo滑块不显示箭头和导航栏

[英]my nivo slider in wordpress dont showing arrows and navigation bar

hi after integrating the nivo slider in my wordpress the images are sliding perfectly with given animation. 嗨,在我的wordpress中集成了nivo滑块之后,在给定的动画下图像可以完美滑动。 but the arrow images for prev and next is not showing.instead it shows 但是上一个和下一个的箭头图像没有显示。

prev and next

in the slider. 在滑块中。 also instead of navigation bullets it shows numbers as 1234 , that navigate according to the images. 而不是导航项目符号,它显示为1234数字,该数字根据图像进行导航。 in which file should i change to solve the problem? 我应该在哪个文件中更改以解决问题?

the nivoslider.css is nivoslider.css是

.nivoSlider {
position:relative;
width:100%;
height:auto;
overflow: hidden;
}
 .nivoSlider img {
position:absolute;
top:0px;
left:0px;
max-width: none;
}
 .nivo-main-image {
display: block !important;
position: relative !important; 
width: 100% !important;
 }

  /* If an image is wrapped in a link */
   .nivoSlider a.nivo-imageLink {
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:0;
padding:0;
margin:0;
z-index:6;
display:none;
background:white; 
filter:alpha(opacity=0); 
opacity:0;
   }
  /* The slices and boxes in the Slider */
   .nivo-slice {
display:block;
position:absolute;
z-index:5;
height:100%;
top:0;
    }
    .nivo-box {
display:block;
position:absolute;
z-index:5;
overflow:hidden;
    }
    .nivo-box img { display:block; }

     /* Caption styles */
     .nivo-caption {
position:absolute;
left:0px;
bottom:0px;
background:#000;
color:#fff;
width:100%;
z-index:8;
padding: 5px 10px;
opacity: 0.8;
overflow: hidden;
display: none;
-moz-opacity: 0.8;
filter:alpha(opacity=8);
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
        }
     .nivo-caption p {
padding:5px;
margin:0;
       }
      .nivo-caption a {
display:inline !important;
        }
       .nivo-html-caption {
         display:none;
        }
        /* Direction nav styles (e.g. Next & Prev) */
      .nivo-directionNav a {
position:absolute;
top:45%;
z-index:9;
cursor:pointer;
       }
     .nivo-prevNav {
left:0px;
        }
       .nivo-nextNav {
right:0px;
       }
    /* Control nav styles (e.g. 1,2,3...) */
     .nivo-controlNav {
text-align:center;
padding: 15px 0;
    }
      .nivo-controlNav a {
cursor:pointer;
    }
   .nivo-controlNav a.active {
font-weight:bold;
     }

EDIT:: 编辑::

i found out the problem. 我发现了问题。 its my mistake. 这是我的错误。 sorry to all. 对不起 i forgot to give get_template_directory_uri() in href.when i gave that arrows and bullets works perfectly. 当我给出箭头和项目符号可以完美工作时,我忘记在href。中给出get_template_directory_uri() this question is resolved . 这个问题解决了

prev and next have CSS classes and background-images you should in your file prevnext在文件中应包含CSS类和背景图像

The Example CSS CSS示例

.nivo-directionNav a {
    background: url("images/arrows.png") no-repeat scroll 0 0 transparent;
    border: 0 none;
    display: block;
    height: 30px;
    text-indent: -9999px;
    width: 30px;
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM