2

jQuery Cycle Pluginを使用して画像をスライドショーしようとしていますが、機能しません。実行可能にする方法。

含まれているスクリプト

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="https://malsup.github.com/jquery.cycle.all.js"></script>    

CSS:

 .pics {  
            height:  232px;  
            width:   232px;  
            padding: 0;  
            margin:  0;  
        } 

        .pics img {  
            padding: 15px;  
            border:  1px solid #ccc;  
            background-color: #eee;  
            width:  200px; 
            height: 200px; 
            top:  0; 
            left: 0 
        }

脚本:

  $(function(){
        $('.pics').cycle('fade');
    });​

Pic Div

          <div class="pics">
                <img src="http://davealger.info/i/1.jpg"  width="200" height="200"  />
                <img src="http://davealger.info/i/2.bmp"  width="200" height="200"  />
                <img src="http://davealger.info/i/3.png"  width="200" height="200" />
            </div>
4

3 に答える 3

2

に変更https://malsup.github.com/jquery.cycle.all.jshttp://ます-またはそれ以上に、プラグインをダウンロードして、彼の貧弱なサーバーを惜しまないでください。Googleは大量のCDNを使用しています。彼はしません。

http://jsfiddle.net/mblase75/ZSJqh/

于 2012-12-04T15:21:51.170 に答える
1

スクリプトをローカルにダウンロードしないように設定されている場合は、最新の状態に保ちます。

  1. Cycle.jsが移動されました。
  2. http://またはhttps://を使用しないでください

ここでは、これはWebサイトのデモから取得され、少し編集されています。

<!-- include jQuery library -->
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="//cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
        fx: 'fade' 
    });
});
</script>

cycle.jsの場所に注意して
ください。デモのソースコードを確認することは有益です。

于 2012-12-13T03:55:28.267 に答える
0
$(function(){
    $('.pics').cycle({fx: 'fade'});
});​

ドキュメントを参照してください:http://malsup.com/jquery/cycle/

于 2012-12-04T15:21:34.430 に答える