グラデーション表現するjQuery Gradient

Check このエントリーをはてなブックマークに追加

配布元:Gradient
ライセンス:MITとGPLのデュアルライセンス

jQuery Gradientは要素などをグラーデーションを簡単に塗りつぶすことができるJavaScriptライブラリです。

利用方法

jQuery本体と配布サイトよりダウンロードしたjquery.gradient.min.jsをhead要素内などで読み込みます。

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.gradient.min.js"></script>

グラデーションの設定は次のように行います。

$(function(){
	$(セレクター).gradient({
		from:      'グラデーションの開始色',
		to:        'グラデーションの終了色',
		direction: 'グラデーションの形態'
	})
})

色はRGBで指定し、directionには横方向のグラデーションの場合は「vertical」、縦方向のグラデーションの場合は「horizontal」を指定します。

$(function(){
	$("div").gradient({
		from:      '1e2a5e',
		to:        '000418',
		direction: 'horizontal'
	})
})

サンプル

スポンサードリンク

コメント

カテゴリー:CSS3 jQuery ライブラリ