Question

我有以下代码不会从滑块中删除div：

$("#slider-next").click(function(){         
    $("#shortslide img").animate({'width':'0px', 'left':'0'});
    $("#dandr-slider #shortslide").remove();
});

有人能让我知道我做错了什么吗？提前谢谢。

这是HTML的一部分：

<div id="dandr-scroller" style="border:1px solid lime;width:790px;height:477px;position:absolute; right:-790px; top:0px;z-index:2000;" class="hide">
    <div id="slider-nav">
        <a href='#' id='slider-prev' style="position:absolute; top:265px; height:27px; left:10px; width:20px; z-index:100; cursor:pointer;"><img src="dandr-arrow-left.png" style="border:0; height:27px; width:20px;" /></a>
        <a href="#" id="slider-next" style="position:absolute; top:265px; left: 740px; height:27px; width:20px; z-index:100; cursor:pointer;"><img src="dandr-arrow-right.png" style="border:0; height:29px; width:22px;" /></a>
    </div>

    <div id="dandr-slider">
        <div id="shortslide" ><img src="trendessential_2.png"  style="border:0; cursor:pointer;"   /></div>
        <div><img src="dandr-0.jpg" style="width:790px; height:477px; border:0; cursor:pointer;" /></div>
        <div><img  src="dandr-1.jpg" style="width:790px; height:477px; border:0; cursor:pointer;" /></div>
        <div><img  src="dandr-2.jpg" style="width:790px; height:477px; border:0; cursor:pointer;" /></div>
        <div><img  src="dandr-3.jpg" style="width:790px; height:477px; border:0; cursor:pointer;" /></div>
        <div><img src="dandr-4.jpg" style="width:790px; height:477px; border:0; cursor:pointer;" /></div>
        <div><img src="dandr-1.jpg" style="width:790px; height:477px; border:0; cursor:pointer;" /></div>
    </div>
</div>

这是整个剧本：

<script language="javascript" type="text/javascript">
  fadeInterval = 2000;
  $("#dandr-right-arrow").hide();
  $("#dandr-left-arrow").hide();
  $("#dandr-scroller").hide();
  $("#dandr-slider").hide();
  $(document).ready(function () {
    $("#dandr-container").css('display', '');
    $("#message").hide();
    $("#message").delay(600).fadeIn(fadeInterval);
    $("#dandr-copy1").delay(1500).animate({ "right": "+=790px" }, "slow");
    $("#dandr-copy2").delay(1600).animate({ "right": "+=790px" }, "slow");
    $("#dandr-copy3").delay(1700).animate({ "right": "+=790px" }, "slow");
    $("#dandr-copy4").delay(1800).animate({ "right": "+=790px" }, "slow");
    $("#dandr-copy5").delay(1900).animate({ "right": "+=790px" }, "slow");
    $("#dandr-copy").delay(1400).animate({ "right": "+=790px" }, "slow", function () {
      setTimeout('ScrollInit()', 1000);
    });
  });
  function ScrollInit() {
    $("#slider-prev").hide();
    $("#dandr-scroller").delay(1000).animate({ "right": "+=390px" }, "slow").show();
    $("#slider-next").css({'position': 'absolute',  'top': '265px', 'left': '350px'});
    $("#slider-next").click(function(){
      $("#test").hide();
      $("#shortslide img").animate({'width':'0px', 'left':'0'});
      $("#dandr-slider #shortslide").remove();
      $("#dandr-copy").hide();
      $("#message").hide();
      $("#dandr-copy1").hide();
      $("#dandr-copy2").hide();
      $("#dandr-copy3").hide();
      $("#dandr-copy4").hide();
      $("#dandr-copy5").hide();
      $("#dandr-scroller").animate({ "right": "0" }, "slow");
      $("#slider-prev").show();
      $("#slider-next").css({'position': 'absolute',  'top': '265px', 'left': '740px'});
    });
    $('#dandr-slider').cycle({
      fx: 'scrollHorz',
      speed: 1200,
      timeout: 0,
      next: $('#slider-next'),
      prev: $('#slider-prev'),
      startingSlide: 0,
      easing: "easeInOutQuint"
    });
  }
</script>

Answer 1

解决此问题的解决方法是在第一张幻灯片中向左浮动图像，动画右+ = 390（半宽）

点击后删除div和内容

1 个答案: