ホームページ上の画像(jpg)にGIFアニメーションを重ねたいのですが、どのようにしたらよいのでしょうか。
具体的には、地図の画像があり、その上に場所を示すため、点滅するボールのGIFアニメーションを載せたいのです。
使用しているものは、ウインドウズ、ページミル3.0、フォトショップ5.5です。
素材サイトからボールのアニメーションはダウンロードしたのですが、どうにもうまく行きません。
どうぞよろしくお願い致します。

このQ&Aに関連する最新のQ&A

A 回答 (3件)

一般的に、ダイナミックHTMLのレイヤー機能を用いるかとおもいます。


これは、JPEGの上に載せたいGIFの大きさのレイヤーを作って、その上にGIF画像をのせ、それをHTML上で置きたい場所に座標指定して表示します。
ただ、IEとNN両方で通用するソースを書くのはちょっと長くなりますし、ページ制作ソフトを使っているとのことなので、直接のソース編集はやっていないと思います。
ページミル3.0が、ダイナミックHTMLのレイヤーに対応しているならばその機能を探し出して使ってください。(DreamWaverなどが比較的こういった要素得意だったと思うのですが、ページミル3.0は一度も触ったことがないので分かりません・・・)

また、その地図がGIFでも問題ないのならば、PhotoShopで全体をアニメーションGIFで作ってしまうというのも一つの手だとお思います。ImageReadyを使えば、画像のほんの一部分(要するにボールの範囲)だけをアニメーション化することもできると思いますので、アニメーションGIFにしたからと言ってそれほどファイルサイズが大きくはならないと思います。
    • good
    • 0
この回答へのお礼

早速のアドバイスをありがとうございます。
そうですね、ImageReadyを使えばうまくいくかもしれませんね。
早速試してみます。どうもありがとうございました。

お礼日時:2001/08/11 16:19

スタイルシートを使えばいいかも。



以下のような感じでHTMLを書いてみてください。
下記のHTMLをそのまんまコピー&ペーストして、ファイル名だけ変えたら、多分、正
常に動きます。

背景を(50,50)の座標(単位:ピクセル)に表示し、アニメーションGIFを(75,55)の座標
に表示します。

IE4.0以降、Netscape4.0以降で表示可能なはずです。

****ココカラ****
<!doctype html public "-//W3C//DTD HTML 4.0//EN">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>test</title>
</head>
<body>
<p>
ほげほげほげ
</p>

<p>
<img src="Haikei.jpg" style="position:absolute; top:50px; left:50px">
<img src="Anime.gif" style="position:absolute; top:100px; left:100px">
</p>

<p style="margin-top:510px"><!--画像の高さの分だけ位置をずらす-->
もがもがもが<br/>
もがもがもが<br/>
もがもがもが<br/>
</p>
<p>
ふごふごふご<br/>
ふごふごふご<br/>
</p>

</body>
</html>
    • good
    • 0
この回答へのお礼

早速のご回答ありがとうございます。
本来ならソースをきちんと理解してやるべきなのでしょうが、私はまだ理解不足で作成ソフトでやっています。
まず先にアドバイス頂きました方法でやってみて、うまくいかなかったら挑戦してみます。
ご丁寧にどうもありがとうございました。

お礼日時:2001/08/11 16:23

地図の画像を、指し示したい地点の数だけ



■■■■
■■■■
■■■■

のように分割します。
そしてそれらをテーブルに組み、各セルの背景(BACKGROUND)として表示させます。
さらに各セルにIMGタグでアニメーションGIFを重ねればOKです。
    • good
    • 0
この回答へのお礼

早速のアドバイスをありがとうございます。
なんとなく私でもできそうな感じなので試してみます。
どうもありがとうございました。

お礼日時:2001/08/11 16:17

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

QアニメーションGIFの保存方法

ホームページの素材コーナーなどに置いてあるアニメーションGIFは、どのように保存すればいいのでしょうか?普通に「画像を保存」で保存すると、ワンカットだけになってしまうので、使えずに困っています。教えて下さい。

Aベストアンサー

>普通に「画像を保存」で保存すると、ワンカットだけになってしまう
そんなことはないと思いますよ。その画像を何で開いて見ていますか?フォトエディターやペイントなどではたしかにワンカットしか見えません。しかし、それをIEで開いてみてください。動いているはずですが。

QIEでアニメーションgifが動かない

Netscapeで動くアニメーション画像がIEでは静止したままです。どうすれば動くようになるか教えてください。
http://ameblo.jp/happy8/

Aベストアンサー

インターネットオプション→詳細設定→Webページのアニメーションを再生するのチェックが外れていませんか。

QアニメーションGIF素材の無料素材集サイトを教えて下さい。

アニメーションGIFの無料素材がダウンロードできるホームページを教えて下さい。

特に、犬とか猫の動物素材があるとうれしいです。

windows用です。

よろしくお願いします。

Aベストアンサー

動物素材、猫素材、犬素材などで検索すると色々出てきますよ。
あと、
動物素材を配布している素材屋さんのランキングです。
http://www.sozaiyasan.com/cgi-bin/ani/ranklink.cgi
個人的に好きな素材サーチサイトは
http://www.sozai-r.jp/

http://www.hisas.jp/
カテゴリ分けされているので、
見やすいしきっとお気に入りのサイトが見つかると思いますよ。
もちろん動物もののカテゴリもあります。

Qgifアニメーションについて

gifアニメのファイルサイズを小さくするには「使う色を少なくする」と聞いたのですが、
ブラシツール(アンチエイリアスが掛かってる)で塗った色の境界の色も1色として数えられるのでしょうか?
それだとやはり主線にアンチエイリアスを掛けてしまうと物凄い数の色を使っていることになりますか?

それと、レイヤーを半透明にしてもファイルサイズが膨れてしまうのでしょうか?

Aベストアンサー

その通り

GIFアニメーションはGIF画像を連続して表示する機能です
差分の画像を表示させることでファイルサイズを小さくすることが可能です
ので、色数が多いと差分の画像容量が大きくなります
とくにアンチエイリアスを掛けた部分はけっこうな色数になります

また、GIFファイル上ではレイヤーという考え方がありません
作画ツールで使用していてもGIFファイルに変換されると一枚のGIF画像に統合されるので
色数が増える原因になります
(GIFアニメーションに変換後もう一度作画ツールで読み直してみてください
 確認できますよ)


…ひょっとして Flashアニメーションと混同していませんか?

QGIFアニメーションのDL

素材屋さんからGIFアニメーションの画像をDLしたいのですが、画像の上で右クリックで画像を保存を選ぶと、時々ファイルの種類のところが「BMP」になってしまって、アニメーションではなく保存されてしまいます。

どうしてこうなってしまうのでしょう?
困っています。
直し方分かる方、教えてください。

Aベストアンサー

よくあるようです。
過去の質問も参考にしてみてください。
http://oshiete1.goo.ne.jp/kotaeru.php3?q=566626

また、参考URLのソフトを用いると一括で 全部の画像をDLできるので便利ですよ。

参考URL:http://www.lares.dti.ne.jp/~tomof/soft/lib/ezw.htm


このカテゴリの人気Q&Aランキング

おすすめ情報