jquery循环窗帘X无法正常工作答案

【问题标题】：jquery cycle curtainX not working properlyjquery循环窗帘X无法正常工作
【发布时间】：2013-04-05 14:56:02
【问题描述】：

我在 jquery 中的“curtainX”循环动画有问题。第一个动画似乎在顶部中心缩小，而不是做它应该做的动画。我似乎找不到问题，现在我不知道从哪里开始。我尝试检查动画的不同选项，但似乎无法弄清楚。

<!DOCTYPE html>
<html>
  <head>
    <style type = "text/css">img{position:absolute;}</style>
    <script src = "jquery.js"></script>
    <script src = "jquery-ui.js"></script>
    <script src = "jquery-cycle.js"></script>
    <script src = "text/javascript">
      function start(){
        $("#blank").cycle({
          fx: 'curtainX',
          sync: false,
          delay: -4000
        });
      }
    </script>
  </head>
  <body>
    <div id = "blank" onclick = "start()">
      <img src = "img/blank.gif" style = "z-index:1"/>
      <img src = "img/1c.gif"/>
    </div>
  </body>
</html>

您可以在http://vrbj.webs.com/flipTest.html查看演示

【问题讨论】：

标签： javascript jquery plugins cycle

【解决方案1】：

好像是没有宽高的问题。

我已经重写了代码here

删除宽度和高度会导致您的问题。

你可以解决变化：

img{position:absolute;}

到

img{position:absolute; width: 59px; height: 74px;}

还要考虑一下您编写代码的方式，看看我写的内容。您的代码是正确的，但编写方式不如小提琴中的“插件兼容”。

【讨论】：

【解决方案2】：

标签中的函数在需要时被调用。尝试在标签中移动你的 start 函数并将其放在 $(document).ready(your function ) 调用中

【讨论】：