【ハウツー】

ゼロからはじめるGlossy - 画像の周りに枠を付けよう

1 ゼロからはじめるGlossy - 画像の周りに枠を付けよう

    古籏一浩  [2007/07/30]

    Glossyとは?

    Glossyは画像のまわりに枠を付けるライブラリです。Glossyは枠だけでなく透過GIF画像を利用して単色または2色のグラデーションを描画することもできます。Glossyは他のライブラリを使用しませんが、動作するブラウザは多少限定されます。<canvas>タグが利用できるブラウザかInternet ExplorerでないとGlossyは動作しません。未対応のブラウザでは、表示効果が反映されないだけで特にエラーが発生するわけではありません。指定した画像がそのまま表示されるだけです。

    Glossyでサポートしている動作ブラウザは以下のようになっています。

    Internet Explorer 5.5以降 Firefox 1.5以降 Safari 2以降 Opera 9以降

    GlossyはこのURLからダウンロードすることができます。

    「Download」の文字をクリックすると内容が展開されます。「Download glossy.js 1.3」の文字をクリックするとダウンロードが行われます。ダウンロードされたファイルはZIP形式になっているので解凍します。解凍すると以下のファイル構成になります。

    解凍後の状態

    ここで必要になるファイルはglossy.jsファイルだけです。他のファイルは説明やサンプル用になっています。実際にGlossyを使用する場合はglossy.jsファイルを任意のフォルダに入れて使用します。また、Glossyでは16×16ピクセル以下の画像では効果が適用されないので注意してください。

    *1ここではGlossyのバージョン1.3で説明しています。

    新着記事

    特設サイトの情報

      人気記事

      一覧

        新着記事

        特別企画

        マイナビニュースマガジン