ふわふわ14■背景画像1個ふわふわ    最終修正日 : 2020/04/08

●2020/04/08:即時関数で囲んで、グローバル変数を消しました。
1個の背景画像が」ゆらゆら回転移動をするJavaScriptです。
いままでの往復移動や回転する背景画像は、『移動幅c×2倍分』だけdivの空間を縮小して、繋ぎ目が出ないようにしました。
そのため100%の画像表示にはならず、いつも一部分が欠けた状態の表示でした。

しかし今回は、1個の背景画像を丸ごとゆらゆらさせるので、画像が欠けたらおかしくなります。
まずJavaScriptでno-repeat記述で1個だけの表示指定をします。

それから画像が欠けないよう、いつもとは逆に『移動幅c×2倍分』だけ、cssでdiv空間を大きくして下さい。
サイトのマスコットのような物を、ゆらゆら動かすと面白いと思います。
位置固定指定は、邪魔のようなら削除して下さい。
原本は、オリジナルJavaScriptから。

いままでの背景画像の往復移動や回転移動は、『動く背景』コーナーに置いてましたが、今回の場合は『画像ふわふわ』のコーナーにしました。
そしてこちらには『動く背景』コーナーの『背景移動・メニュー』の『部分の背景画像の回転移動』があります。
二つのJavaScriptはほとんど同じです。

2020/04/05:回転速度の指定ができるように修正。
2020/04/08:回転背景画像のCSSに no-repeat を追加とJavaScript微修正。