Javascript ライブラリの利用 jQuery cross-slide

Js

jQueryはJavascriptライブラリの一種。
jQuery本体のファイル、プラグインファイル、本文にファイルを呼び出すscript。

jQueryの利用に必要なもの

ファイルのダウンロード

ファイルの形式にminと書かれた軽いもの、Uncompressedの比較的読解できるものがある。好みで使う。


ブラウザ表示
画像のサイズがそろってないと、とてもかっこわるい。
scriptファイルを呼び出して使う

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>jquery</title>
    <script type="text/javascript" src="../jquery/jquery-1.7.2.js"></script>
    <script type="text/javascript" src="../jquery/jquery.cross-slide.min.js"></script>

    <style type="text/css">
    #slideshow{
		width: 600px;
		height: 400px;
		margin: 50px 0 0 50px;
		}
    </style>
</head>
<body>
<div id="slideshow"></div>	
    <script type="text/javascript">
  $(function() {
    $('#slideshow').crossSlide({
      sleep: 5,//１枚の表示時間
      fade: 2,//切り替わりのスピード
	  loop:2//繰り返し回数　なければずっとループ
    }, [
      { src: 'preview/file00018790802.jpg' },
      { src: 'preview/file0001320754093.jpg' },
      { src: 'preview/file7881340638543.jpg' },
      { src: 'preview/file1861243993530.jpg' }
    ])
  });
</script>
</body>
</html>