第11回ホームページ勉強会

11日目 2021年 1月14日実施

講師 : 三宅 節雄


 Gifアニメの挿入


 前回の『ホームページ勉強箱』のスライドショーの改良版では、HTMLソースを直接編集しますが、ソースの1文字でも余分に残したり消したりした場合には、正常に動作しなくなります。

 皆さんのHPを確認させて頂き、勉強会で勉強した内容で完成していることを確認しました。皆さんご苦労様です。

 また、ホームページ勉強会では前勉強会(第10回ホームページ勉強会)に続いて、Gifアニメをダウンロードして、皆さんのホームページに動きのあるアニメを張り付けてみましょう。

1.Gifアニメ


 
1)ダウンロード


  Gifアニメをフリーでダウンロードできる場所はいっぱい在り、このサイトに一覧表示されています。
その中の4箇所をリストアップしました。


  ①MapLab
  ②パタパタアニメ館
  
③カツのGifアニメ
  
④鳥の素材(フリーバード)

  『①MapLabをクリックします。
  

  好みのGifアニメを選択し、選択後の画面上で右クリックし、「名前を付けて動画を保存」で保存します。


 
 『②ぱたぱたアニメ館 をクリックします。
  
  
  
項目ごとに分類されていますから、赤い四角で囲んだ項目からお好みのアニメの上で右クリックし
  「名前を付けて動画を保存」で保存します。



  
『③カツのGifアニメ をクリックします。
  
  項目ごとに分類されていますから、赤い四角で囲んだ項目からお好みの項目を選び、アニメの上で
  右クリックし、「名前を付けて動画を保存」で保存します。



  『④鳥の素材
をクリックします。
  

  
項目ごとに分類されていますから、赤い四角で囲んだ項目からお好みの項目を選び、アニメの上で
  右クリックし、「名前を付けて動画を保存」で保存します。



  
ダウンロード例を下記に示します。
  

 2)使い方

 
 使い方はすごく簡単です。例えばトップページでは「img」のフォルダーにgifアニメのファイルを入れておき、
  トップのindex.htmlをビルダーで開き、入れたい場所にドロップ&ペーストでそこへ持っていくだけでOKです。

  ファイルの前で改行すれば下の行へ移動しますし、スペースを前に入れれば右へ移動します。


2.Giam

 ダウンロード、インストール、使い方

  以下に、パラパラ漫画からgifアニメを簡単に作成できるGiamの、ダウンロード、インストール、使い方をまとめた
  ファイルにリンクしました。
  最新Ver2.09は2010年ですから、以前インストールした方も最新Verの筈です。

  Giamの説明ファイルへリンク