湘南フレームをダウンロードして解凍すると、下記のようなフォルダが作成されます。 "frame"フォルダを湘南フレームを使いたいHTMLファイルと同じフォルダ内にまるごとアップロードしてください。
湘南フレームを使いたいHTMLファイルの</body>の直前に 「<script src="frame/shonan_frame.js"></script>」を、追記するだけでインストール完了です。 詳しくは、"readme.txt"をお読みください。
■ファイル構成
■ファイルダウンロード
■フォルダ(ディレクトリ)
 |
frame |
 |
湘南フレームフォルダ(ディレクトリ) |
■ファイル(フォルダ)
 |
index.html |
 |
湘南フレームを使ったサンプルページ |
|
readme.txt |
|
湘南フレーム説明ファイル |
|
frame/shonan_frame.js |
|
湘南フレームJavaScript |
|
frame/XXXX.png |
|
湘南フレーム用画像ファイル |
■ 設置手順
1. |
湘南フレームの読み込み方法 「湘南フレーム」を使いたいHTMLファイルのタグの終わりに 「<script src="shonan_frame.js"></script>」を追記してください。
|
2. |
湘南フレームのアップロード
「湘南フレーム」を使いたいHTMLと同じフォルダに、"frame"フォルダをまるごとアップロードしてください。
|
3. |
湘南クラスの設定
「湘南フレーム」を設定したい<img>タグに、class="ShonanXXX"という湘南クラスを設定してください。
例) <img src="xxx.jpg" class="ShonanRound1">
|
4. |
角丸用背景色の設定
湘南フレームの角丸部分を表現するために、背景色を設定するクラスが必要です。
「湘南フレーム」を使うHTMLに、背景色のみを設定するためのCSSを用意してください。
下記のスタイルをHTMLファイルの<head>〜</head>に記述します。
<style type="text/css">.BgColor{ background-color: (背景色) }</style>
|
|