|
第11回ホームページ勉強会
『I. A. Wayback Machine』から「6面_①横回転」スライドの作成
|
|
コロナ肺炎が蔓延中の2022年1月の第11回ホームページ勉強会の自宅学習前の第31日目で『6面体に配置された写真(フォトキューブ)をcssでを回転させる』方法のHTMLとCSSを編集して圧縮したものを皆さんにダウンロードして頂き、解凍して勉強を実施しました。
2022年1月頃には、該当ページで写真6枚が色んな動き方をするのが見えましたが、2024年に入って気が付いたら動きだけでなく写真そのものも表示されなくなってしまいました。
その後、2024年6月に『インターネットアーカイブ ウエイバックマシン』に保管された2021年7月27日のWebページ『回転する3DバナーのVol2 立体の箱を回転させる』に基づいて勉強を実施しましたが、今回も同じWebページの、Vol3 6面の横回転サンプル色々の第1項目『 1.横長バナーのシンプルアニメーション』をご覧になり、6面の横回転スライドショーを作って見て下さい。今回も皆さんの作品を発表して頂いてから、勉強に入ります。
この横回転スライドでは、タイトルに横長バナーとありますが横縦比は記載されていません。しかしCSSに height: 140px; width: 250px; という記載が有りますので、横縦比は地デジと同じ16:9です。従って写真は800×450pxで6枚準備して頂く事になります。通常の4:3の写真を使う場合は600×450pxで、cssのheight: 140px;という表記を2か所ともheight:
188px;に変えます。
600×450pxの写真を使用し、説明書に記載されたものをそのまま適用し、heightを188px;に変えた場合には、下図の様な表示になります。
上記の設定から、[START]、[RESET] から [PAUSE]、[START] に変え、設定を変えタイトルやBGMを追加し、
画像のサイズも大きくして、支部だよりの幅900pxにした事例はここからご覧になれます。
[PAUSE]、[START] ボタンを取り去った事例はここからご覧になれます。
支部だより風にアレンジした事例はここからご覧になれます。
『YouTube』からのダウンロード
『YouTube』の仕様変更で『Craving Explorer』を使ってのダウンロードができなくなっているのを、7月中旬に気が付きましたが、その時は『oCam』でPCの動く画面をコピーで何とかなりました。その後、別件で色々探しているときに、『YouTube』のダウンローダーを発見しました。
新しく見つけた『YouTube』からのダウンロード方法、インストール、使い方、注意点については、ここをクリックしてご覧下さい。
最新情報:Craving Explore v2.9.4 (2024.7.25) 32bitをアンインストールし、
Craving Explorer v2.9.5 (2024/08/02) 64bitをインストールしたら、YouTybeからダウンロード
できるようになりました。 2024/08/02に早速実施!
古いCraving Exploreをお使いの方は一度アンインストールして、ここから新Ver.をダウンロードして
インストールして下さい。
|
|
|
|
|
|