Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/api/5.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
水平滚动div中的jQuery循环:IE问题_Jquery - Fatal编程技术网

水平滚动div中的jQuery循环:IE问题

水平滚动div中的jQuery循环:IE问题,jquery,Jquery,我在IE 6和7中遇到了一个问题,在水平滚动分区中嵌入了循环幻灯片。我使用了此技术()创建了水平滚动分区。我将在滚动分区中嵌入循环幻灯片。所有这些都在FF3、Opera和Chrome中正常工作。在IE6和IE7中,图像和导航缩略图的容器是固定的,它们不会滚动。可滚动div中的其他每个div或元素都可以正常工作 这是我的代码: <div id="content"> <div id="contentscroll"> <div id="contentholde

我在IE 6和7中遇到了一个问题,在水平滚动分区中嵌入了循环幻灯片。我使用了此技术()创建了水平滚动分区。我将在滚动分区中嵌入循环幻灯片。所有这些都在FF3、Opera和Chrome中正常工作。在IE6和IE7中,图像和导航缩略图的容器是固定的,它们不会滚动。可滚动div中的其他每个div或元素都可以正常工作

这是我的代码:

<div id="content">
  <div id="contentscroll">
    <div id="contentholder">

      <div class="contentitem">
        <span class="name">ABC</span>
        <span class="price">25 €</span>
    <div class="photo">
          <img src="642_03_prod[1].png" height="280" width="280" />
          <img src="855_02_prod[1].png" height="280" width="280" />
          <img src="856_01_prod[1].png" height="280" width="280" />
        </div>
        <ul class="colors">
          <li><a href="#"><img src="642_03_prod[1].png" height="25" width="25" /></a></li>
          <li><a href="#"><img src="855_02_prod[1].png" height="25" width="25" /></a></li>
          <li><a href="#"><img src="856_01_prod[1].png" height="25" width="25" /></a></li>
        </ul>
      </div>

      <!--- other contentitem --->

    </div> <!--- end contentholder --->
  </div> <!--- end contentscroll --->
</div> <!--- end content --->
这是JS:

$('.photo').cycle({ 
    fx:     'turnDown', 
    speed:  'fast', 
    timeout: 0, 
    pager:  '.colors',
    fastOnEvent: true,
    slideExpr:     null,
    cleartype:  true,
    cleartypeNoBg:  true,
    pagerAnchorBuilder: function(idx, slide) { 
        // return selector string for existing anchor 
        return '.colors li:eq(' + idx + ') a'; 
} 
});

有人能帮我吗?Cycle是否将CSS适当地应用于.photo和.colors以及这一事实造成了这个问题。名称span e.价格span滚动。

我已经用DebugBar控制:循环添加一些样式和属性:

<DIV class=photo style="WIDTH: 280px; POSITION: relative; HEIGHT: 280px" cycleStop="0" cyclePause="0" cycleTimeout="0" jQuery1245766927421="13">

<IMG style="DISPLAY: none; Z-INDEX: 3; LEFT: 0px; ZOOM: 1; POSITION: absolute; TOP: 280px; HEIGHT: 0px" height=280 src="642_03_prod[1].png" width=280 cycleH="280" cycleW="280" jQuery1245766927421="10">
<IMG style="DISPLAY: block; Z-INDEX: 4; LEFT: 0px; WIDTH: 280px; ZOOM: 1; POSITION: absolute; TOP: 0px; HEIGHT: 280px" height=280 src="855_02_prod[1].png" width=280 cycleH="280" cycleW="280" jQuery1245766927421="11">
<IMG style="DISPLAY: none; Z-INDEX: 1; LEFT: 0px; POSITION: absolute; TOP: 0px; HEIGHT: 0px" height=280 src="856_01_prod[1].png" width=280 cycleH="280" cycleW="280" jQuery1245766927421="12">

</DIV>

images div容器上有一个
位置:相对
,imgs上有一个
位置:绝对,显示:块

我认为这些属性是问题的原因,但我不知道如何删除它们。

文件jquery.cycle.all.js:

第187行:

// container requires non-static position so that slides can be position within
    if ($cont.css('position') == 'static')
        $cont.css('position', 'relative');
第212行:

// set position and zIndex on all the slides
    $slides.css({position: 'absolute', top:0, left:0}).hide().each(function(i) {
        var z = first ? i >= first ? els.length - (i-first) : first-i : els.length-i;
        $(this).css('z-index', z)
    });
我认为JS的这两个部分对于解决这个问题很重要,但我不知道如何解决

// set position and zIndex on all the slides
    $slides.css({position: 'absolute', top:0, left:0}).hide().each(function(i) {
        var z = first ? i >= first ? els.length - (i-first) : first-i : els.length-i;
        $(this).css('z-index', z)
    });