0

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でデモを見ることができます。

4

2 に答える 2

0

幅と高さがないことに関連する問題のようです。

ここのコードを書き直しました

幅と高さを削除すると問題が発生します。

変更を解決できます：

img{position:absolute;}

に

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

私が書いたものを見て、コードを書いた方法も考えてください。あなたのコードは正しいですが、書かれた方法は、フィドルよりも「プラグインの準拠」が少なくなっています。

于 2013-04-05T15:26:42.157 に答える