我尝试使用旋转滑块js在中心 - 底部位置设置一个简单的项目符号列表滑块。这是我的旋转滑块设置:
<script type="text/javascript">
var tpj=jQuery;
var revapi2;
tpj(document).ready(function() {
if(tpj("#rev_slider_2_1").revolution == undefined){
revslider_showDoubleJqueryError("#rev_slider_2_1");
}else{
revapi2 = tpj("#rev_slider_2_1").show().revolution({
sliderType:"carousel",
jsFileLocation:"/libs/revolutionSlider/js/",
dottedOverlay:"none",
sliderLayout: "auto",
delay:9000,
navigation: {
keyboardNavigation:"off",
keyboard_direction: "horizontal",
mouseScrollNavigation:"off",
onHoverStop:"off",
arrows: {
style:"",
enable:true,
hide_onmobile:false,
hide_under:300,
hide_onleave:true,
hide_delay:200,
hide_delay_mobile:1200,
tmp:'',
left: {
h_align:"left",
v_align:"center",
h_offset:30,
v_offset:0
},
right: {
h_align:"right",
v_align:"center",
h_offset:30,
v_offset:0
}
}
,
bullets: {
enable: true,
hide_onmobile: false,
style: "hesperiden",
hide_onleave: false,
direction: "horizontal",
h_align: "center",
v_align: "bottom",
h_offset: 20,
v_offset: 2,
space: 5,
tmp: ''
}
},
carousel: {
horizontal_align: "center",
vertical_align: "center",
fadeout: "off",
maxVisibleItems: 3,
infinity: "on",
space: 0,
stretch: "off"
},
viewPort: {
enable:true,
outof:"pause",
visible_area:"80%"
},
responsiveLevels:[1240,1024,778,480,320],
gridwidth:[1240,1024,778,480,320],
gridheight:[600,600,500,400,300],
lazyType:"none",
parallax: {
type:"mouse",
origo:"slidercenter",
speed:2000,
levels:[2,3,4,5,6,7,12,16,10,50],
},
shadow:0,
spinner:"off",
stopLoop:"on",
stopLoop:"on",
stopAfterLoops:0,
stopAtSlide:1,
shuffle:"off",
autoHeight:"on",
hideThumbsOnMobile:"on",
hideSliderAtLimit:0,
hideCaptionAtLimit:0,
hideAllCaptionAtLilmit:0,
debugMode:false,
fallbacks: {
simplifyAll:"off",
nextSlideOnWindowFocus:"off",
disableFocusListener:false,
}
});
}
}); /*ready*/
</script>
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="tp-bullets hesperiden horizontal nav-pos-hor-center nav-pos-ver-bottom nav-dir-horizontal noSwipe" style="top: 100%; transform: matrix(1, 0, 0, 1, 20, -2); left: 50%;">
<div class="tp-bullet selected" style="top: 0px;"></div>
<div class="tp-bullet" style="top: 0px;"></div>
<div class="tp-bullet" style="top: 0px;"></div>
<div class="tp-bullet" style="top: 0px;"></div>
</div>
&#13;
我的代码有什么问题?在文档文档中,我只能看到应该放置子弹的属性空间,考虑到5px的空间......我已经设置了它,但它没有用。