jQueryを使ったタブメニューの実装サンプルまとめ | 5am! Web Illusions

jQueryを使ったタブメニューの実装サンプルまとめ | 5am! Web Illusions


使用した例
第一医科


「jQueryを使ったタブメニューの実装サンプルまとめ」のページを創りたい人は、
最新版のjQuery本体(1.11.x)だと、動きません。
「jquery-migrate-1.2.1.min.js」を使いすると、動きます。

jquery_uiダウンロード(zipファイル)

リンクの張り方

[html]
<link href="css/ui.tabs.css" rel="stylesheet" type="text/css" media="all" />
<!– jQuery Links –>

<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="js/ui.core.js"></script>
<script type="text/javascript" src="js/ui.tabs.js"></script>

<script type="text/javascript">
$(function() {
// 5000sごとに自動切換え
$(‘#ui-tab > ul’).tabs({fx:{opacity:’toggle’,duration:’slow’}}).tabs(‘rotate’,5000);
});
</script>

[/html]


コーディングにチャレンジしたい人用

白澤書店(架空サイト)コーディング Fireworksカンプをダウンロード

旧クラスのコーディング例