今日の人気記事

  1. select要素の複数選択フォームを実装「Multiple Select」
  2. クリック操作で時計回りにスライドする画像ギャラリー「Aperture」
  3. テーブルにページャーを「PaginateMyTable」
  4. 画像の拡大・縮小と移動(パン)「pan and zoom 」
  5. デジタル時計のカウントダウンタイマー「TimeTo」

ID・要素のプロパティに透明度を指定「colorAlpha」

スポンサーリンク

ID・要素のプロパティの透明度を指定するjQueryプラグイン「colorAlpha」を紹介します。

jQueryプラグイン「colorAlpha」

「colorAlpha」は、jQuery(CSS)で選択したIDや要素などのプロパティに透明度を数値で指定することができるプラグインです。透明度は、0〜100の数値で指定し、0が全透過で、100が透過なしです。

スポンサーリンク

IDや要素の選択についてはこちらを参考にしてください。 » jQuery入門

デモをご覧ください。

「colorAlpha」のデモ

デモのソース(HTML + jQuery)

<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title>Load Laterのデモ - jQueryまとめのカルマ</title>
<script src="http://code.jquery.com/jquery-2.0.0.js"></script>
<script type="text/javascript" src="jquery.coloralpha.js"></script>
</head>
<body>
<div id="element">
  ああああああああああああああああああああああああ
  ああああああああああああああああああああああああ
  ああああああああああああああああああああああああ
  ああああああああああああああああああああああああ
</div>
<style>
#element {
  background-color: #FF0000;
}
</style>
<script>
$('#element').colorAlpha({
  property : 'background-color',
  percent : 10
});
</script>
</body>

その他詳細はこちらからどうぞ。
» colorAlpha

スポンサーリンク

関連記事(一部広告含む)