jquery-ui タブを使用して簡単なスライドショーを作成する方法を学ぼうとしています。これまでのところ、私の Google 検索スキルは役に立ちませんでした。私はまだ JavaScript の初心者です。サンプルチュートリアルを使用してjquery-uiタブを作成する方法はすでに知っています。それから簡単なスライドショーを作成する方法を学びたいだけです。ここにいる誰かが私のために作るのを手伝ってくれるなら、助けてください。
ページが読み込まれるとスライドショーが自動的に再生され、マウスがその上に置かれるたびに停止します。また、スライド効果を追加できる場合は、追加してください。どうもありがとうございました。
JSfiddle で既に設定されているコードを次に示します:
http://jsfiddle.net/TcNJ2/
<!DOCTYPE html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" >
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.js"></script>
<script>
$(function() {
$( "#tab" ).tabs();
});
</script>
</head>
<body>
<div id="tab">
<ul id="btn">
<li><a href="#1">1</a></li>
<li><a href="#2">2</a></li>
<li><a href="#3">3</a></li>
<li><a href="#4">4</a></li>
<li><a href="#5">5</a></li>
</ul>
<br class="clear">
<div id="slides">
<div id="1">Slide 1</div>
<div id="2">Slide 2</div>
<div id="3">Slide 3</div>
<div id="4">Slide 4</div>
<div id="5">Slide 5</div>
</div>
</div>
</body>
CSS は jsfiddle リンクにあります