0

このような基本的な質問で申し訳ありませんが、CrossSlide jquery プラグインを動作させることができないようです。

Webブラウザの中央に配置され、すべてが同じ寸法ではないさまざまな画像を使用して、単純なスライドショーを作成したいと考えています。

ありがとう！ 

<head>

<meta http-equiv="content-type" content="text/html; charset=UTF-8">


<style type="text/css">

body {

    background-color: black;
    margin: 20px;
    font-family: sans-serif;
    font-size: xx-small;
    color: white;
}



a {
    text-align: right;
    color: white;
}

#slideshow {
  width: 100%;
  height: 100%;
}

</style>


<title>CrossSlide</title>


</head>



<body>


<div><span class="contact-info"><a href="mailto:none@none.com">none@none.com</a></div>


<div id="slideshow"></div>






<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery.cross-slide.min.js"></script>
<script>
  $(function() {
    $('#slideshow').crossSlide({
      sleep: 2,
      fade: 1
    }, [
      { src: 'data/tea.jpg' },
      { src: 'data/tea2.jpg' },
    ])
  });
</script>

</body>
</html>
4

1 に答える 1

0

大きな問題は、古い jQuery ライブラリを参照していたことです。

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery.cross-slide.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('#slideshow').crossSlide({
            sleep: 2,
            fade: 1
        }, [
                { src: 'content/tea.png' },
                { src: 'content/tea2.jpg' }
            ]);
    });
</script>

Chrome を使用している場合は、レンチ アイコン (右上)、[ツール]、[JavaScript コンソール] の順にクリックするか、ショートカット Ctrl+Shift+J を使用すると、JavaScript エラー メッセージが表示されます。

于 2012-08-28T20:14:52.590 に答える