• 予(予禾)
  • 恒河沙
  • 阿僧祇
  • 那由多
  • 不可思議
  • 無量大数
  • 分・割
  • 緲(眇)
  • 模糊
  • 逡巡
  • 須臾
  • 瞬息
  • 弾指
  • 刹那
  • 六徳

このプラグインの実際の動きを確認したい場合は、PCからアクセスして下さい。

  • files
  • js
  • html
<link href="<PATH>/champagne.min.css" rel="stylesheet" />
<script src="<PATH>/jquery.min.js"></script>
<script src="<PATH>/jquery.champagne.min.js"></script>
<script>
	$(window).load(function(){
		$('#champagne .champagne li').on('click', function(){
			alert($(this).data('call'));
		});
		$('#champagne button').on('click', function(){
			var show = $(this).data('show');
			var hide = $(this).data('hide');
			$('#champagne #champagne' + show).show();
			$('#champagne #champagne' + hide).hide();
			$('#champagne #champagneDemo00').hide();
			$('#champagne #champagne' + show).champagne({
				delayBetween: 100
			});
		});
	});
</script>
<button data-show="Demo01" data-hide="Demo02" class="blue">おおきいのがいい</button>
<button data-show="Demo02" data-hide="Demo01" class="yellow">ちいさいのがいい</button>

<ul id="champagneDemo00" class="champagne">
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
</ul>

<ul id="champagneDemo01" class="champagne">
	<li data-call="いち 10の0乗">一</li>
	<li data-call="じゅう 10の1乗">十</li>
	<li data-call="ひゃく 10の2乗">百</li>
	<li data-call="せん 10の3乗">千</li>
	<li data-call="まん 10の4乗">万</li>
	<li data-call="おく 10の8乗">億</li>
	<li data-call="ちょう 10の12乗">兆</li>
	<li data-call="きょう(けい) 10の16乗">京</li>
	<li data-call="がい 10の20乗">垓</li>
	<li data-call="じょ 10の24乗">予(予禾)</li>
	<li data-call="じょう 10の28乗">穣</li>
	<li data-call="こう 10の32乗">溝</li>
	<li data-call="かん 10の36乗">澗</li>
	<li data-call="せい 10の40乗">正</li>
	<li data-call="さい 10の44乗">載</li>
	<li data-call="ごく 10の48乗">極</li>
	<li data-call="ごうがしゃ 10の52乗">恒河沙</li>
	<li data-call="あそうぎ 10の56乗">阿僧祇</li>
	<li data-call="なゆた 10の60乗">那由多</li>
	<li data-call="ふかしぎ 10の64乗">不可思議</li>
	<li data-call="むりょうたいすう 10の68乗">無量大数</li>
</ul>

<ul id="champagneDemo02" class="champagne">
	<li data-call="いち 10の0乗">一</li>
	<li data-call="ぶ・わり 10の-1乗">分・割</li>
	<li data-call="りん 10の-2乗">厘</li>
	<li data-call="もう 10の-3乗">毛</li>
	<li data-call="し 10の-4乗">糸</li>
	<li data-call="こつ 10の-5乗">惚</li>
	<li data-call="び 10の-6乗">微</li>
	<li data-call="せん 10の-7乗">繊</li>
	<li data-call="しゃ 10の-8乗">沙</li>
	<li data-call="じん 10の-9乗">塵</li>
	<li data-call="あい 10の-10乗">埃</li>
	<li data-call="びょう 10の-11乗">緲(眇)</li>
	<li data-call="ばく 10の-12乗">漠</li>
	<li data-call="もこ 10の-13乗">模糊</li>
	<li data-call="しゅんじゅん 10の-14乗">逡巡</li>
	<li data-call="しゅゆ 10の-15乗">須臾</li>
	<li data-call="しゅんそく 10の-16乗">瞬息</li>
	<li data-call="だんし 10の-17乗">弾指</li>
	<li data-call="せつな 10の-18乗">刹那</li>
	<li data-call="りっとく 10の-19乗">六徳</li>
	<li data-call="きょ 10の-20乗">虚</li>
	<li data-call="くう 10の-21乗">空</li>
	<li data-call="せい 10の-22乗">清</li>
	<li data-call="じょう 10の-23乗">浄</li>
</ul>

champagneについて

champagneは、指定要素内の要素をランダムにフェードインしながら表示してくれるプラグインです。
画像ギャラリーサイトの画像一覧ページとかに使うと効果的かもしれません。
ダウンロード こちら
ドキュメント ドキュメントページはありません
デモ こちら
ライセンスMIT
対応ブラウザ

関連するjQueryプラグイン

  • RealShadow

    RealShadow

    RealShadowは、マウスの動きに追随するシャドウを簡単に設置できる

  • LivingFade

    LivingFade

    指定要素をランダムにフェードイン、フェードアウト

  • glassyWorms

    glassyWorms

    背景にミミズをはわせる

  • Macaroon

    Macaroon

    クッキーの取得、セット、削除を簡単にできる

  • FaviconNotifier

    FaviconNotifier

    ファビコンに数字を表示したり、変えたりすることができる