背景に登録した画像が次々に表示される際のアクションの種類が増えました。
アクションの時間指定や、アクションを停止する選択肢も増え、表現の幅が増えました。
同時に新しくなった画像の上下左右寄せ・サイズ指定と合わせて説明します。
これまでの「横にスライド」に「フェードアウト」など3種類を追加、アクションなしの「静止」も追加して5つから選べます。
横にスライドの表現も少し変わリました。
以下のサンプルをご参考ください。
これまでの2種類だけだった背景サイズに、以下のサイズを追加しました(「横一杯に引伸し」は「自動幅1」と名称変更)。
名称 | サイズ |
---|---|
自動幅1 | 領域全体を覆うように背景画像を自動調整 |
自動幅2 | 背景画像の全体が見えるように背景画像を自動調整 |
元の幅 | アップロードした画像の元の幅 (アップロード時に横幅は1,920px以下に縮小されます) |
100%~25%幅 | 背景画像の横幅を、画面の横幅の100~25%に調整 |
一方、上下左右寄せや画像ドラッグによる縦方向の微調整は、制限を取り除き、各サイズと組合せて利用できます。
以下のサンプルをご参考ください。
背景画像アクションは、あらゆるブロックの「装飾」から利用できます。
メイン画像エリアでは、下部に常時表示される「メイン画像の登録」欄から利用できます。
画像は次の3つのボタンから追加できます。
画像はこのボタンから複数登録できます。
複数登録した画像は「複数画像アクション」で設定した動作により順番に表示されます。
アクションは「1枚の表示秒数」で時間設定ができます。
登録した画像は小さなプレビュー画像付きのリストで表示されます。リストにある3つの選択欄で、画像のサイズ・上下位置・左右位置を設定出来ます。
プレビュー画像をドラッグして画像の上下位置を細かく調整できます。
プレビュー画像の上にある「上」「下」ボタンから常時順の入れ替えができます。
また隣の「削除」ボタンから画像の削除ができます。
複数画像アクションを「なし(静止)」にすると、複数の画像を重ねて1枚の静止画のように表示できます。
ただし、順番が後方の画像が優先表示されるので、サイズとの組合せで利用する必要があります。
画像は枚数とアクションの設定により、繰り返し表示の有無が自動で切り替わります。
繰り返しが「有」の場合は、画像がタイルのように並んで表示されます。領域よりも画像が小さい場合に、空いた隙間に画像が表示されることで確認できます。
アクション=なし(静止) | アクション=なし(静止)以外 | |
---|---|---|
画像枚数=1枚 | 無 | 有 |
画像枚数=複数 | 無 | 1枚目のみ有 2枚目以降は無 |
いずれのアクションもCSSのみで構成されているのが最大の特徴です。
そのため、次のような特徴があります。