滑块不能正常工作

时间:2014-03-30 08:37:04

标签: jquery html css

我的滑块的所有文本在转到第二个项目时都会消失(我正在使用unslider),而且它在Firefox中不起作用,但它在所有其他浏览器中?知道我做错了什么吗? (http://www.markomd22.twentytwo.axc.nl/

代码我使用的是html / php:

<div id="SliderArtikels" >
<div class="SliderTekst">
<ul class="Slider cf">
<?php $texts = array(); $count = 1; ?>
<?php if($teksten = get_field('artikels')):?>
<?php foreach($teksten as $tekst){ ?>
<?php  $texts[]= $tekst['artikelhoofd'];  ?>
<li class="homepage_tekst">
<div class="SliderKop-<?php echo $count?>">
<div class="slider_hoofdtekst"><a class="artikelHoofdTekst" href="#"><?php echo $tekst['artikelhoofd'];?></a></div>
<div class="ChangeFont-Ostrich-sb"><time class="dateTime"><?php echo $tekst['datetime']; ?></time></div>
<div class="slider_tekst"><a class="artikelTekst" href="#"><?php echo $tekst['artikeltekst'];?></a></div>
<div class="ReadMore"><a class="ChangeFont-Ostrich-sb ReadMoreTekst" href="#">Read More</a></div>
</div>
</li>
<?php $count++; ?>
<?php }?>
<?php endif;?>
</ul>
</div>
</div>

的CSS:

.HomeTextSlider li{list-style:none;background:none;top:5px;left:0;}
.HomeTextSlider ul{padding-left:0;}
.HomeTextSlider ul li{float:left;}
.HomeTextSlider .dots{position:absolute;bottom:40px;padding-left:0;}
.HomeTextSlider .dots li{display:inline-block;width:10px;height:10px;margin:0 4px;text-indent:-9999px;border-radius:6px;cursor:pointer;background-color:#fff;-webkit-transition:background 0.5s, opacity 0.5s;-moz-transition:background 0.5s, opacity 0.5s;transition:background 0.5s, opacity 0.5s;}
.HomeTextSlider .dot{-webkit-filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));-moz-filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));-ms-filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));-o-filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));}
.HomeTextSlider .dots li.active{opacity:1;background:#E0521A;}

jquery的:

var slidesText= jQuery('.SliderTekst').unslider({
speed: 500,
delay: 5000,
keys: true,
dots: true
});

function placeDots(){
jQuery('.SliderTekst').each(function(){
var length = jQuery('.SliderTekst ul li').length * 100 + '%';
jQuery('.SliderTekst').css('width', '100%');
jQuery('.SliderTekst ul').css('width', length);
});
 jQuery('.SliderTekst .dots').each(function(){
var dots = jQuery(this);
});
}

0 个答案:

没有答案