『残像を残しながら画像を自動的に切り替える』テクニックを使ってみたいのですが、JavaScriptというのが、よくわかりません。
こちらのサイトで、テクニックを紹介されていますが、
↓
http://iswebmag.hp.infoseek.co.jp/sample141.html
初心者のため???です。
そのままコピペしてもダメみたいだし・・・
どなたかもっとわかりやすく教えてください。
参考になるサイトや本があれば、教えてください。
No.2ベストアンサー
- 回答日時:
コピペのやり方ですが、
新規ページ→標準モードでHTMLソース画面に切り替えた後、
既に入っているソースを全て削除してからコピペします。
また、記載されているソースをそのままコピペすると、
余計な文字が入ることがあります。
エラーが検出されるのはそのためです。
ソースを最後まで見比べてみて、余計な文字があったらきちんと消してください。
例)ビルダーのHTMLソース画面にコピペした後、?が入る
image[0]='?http://www.infoseek.co.jp/images/isj00/head/t_is …
?は不要です。
>ページ編集の画面は黒の背景で、上部中央に、×マークの入ったチュウリップの画像が出ます。
http://~で始まる画像(web上に存在する画像)を直リンクで読み込んでいるので、それが正しい動作なのです。
ビルダーのプレビュー画面で画像表示と動作を確認してください。
ご自分の用意した画像にしたい時は、HTMLについての知識(相対パス)が必要です。
例えばの話で、
『作成したページを保存したフォルダ』と同じフォルダ内に画像(img01.jpg、img02.jpg、img03.jpg)を保存し、
画像URLを相対パスで置き換えれば、ページ編集画面でもチューリップマークにはならないでしょう。
image[0]='img01.jpg';
image[1]='img02.jpg';
image[2]='img03.jpg';
<IMG src='img01.jpg' id="imgframe" style="filter:blendTrans">
コピペした後に入っている「?」を消して、背景色を変えたら、
成功しました!
相対パスの知識がないので、
オリジナルの画像にはまだできないのですが・・・
これから挑戦してみます。
ありがとうございました!
No.3
- 回答日時:
追記。
黒の背景になるのは、
<BODY bgcolor="#000000" onLoad="imgchange()">
BODY bgcolor="#000000" つまり黒で背景色指定になっているためです。
白で背景色の指定をすればよいと思います。
No.1
- 回答日時:
>そのままコピペしてもダメみたいだし・・・
ほとんど、「HTMLソース」のコピー&ペーストでよいと思いますが↓
<HTML>
<HEAD>
<TITLE>魅せるホームページ作成講座</TITLE>
</HEAD>
<SCRIPT language="JavaScript">
<!--
var time=3;
var rtime=10000;
var image= new Array();
image[0]='http://www.infoseek.co.jp/images/isj00/head/t_is …
image[1]='http://cmm001.goo.ne.jp/img/logo/goo.gif';
image[2]='http://oshiete1.goo.ne.jp/images/powered_by_okwa …
var ii=0;
function imgchange(){
imgframe.filters.blendTrans.Apply();
imgframe.filters.blendTrans.duration=time;
imgframe.src=image[ii];
imgframe.filters.blendTrans.Play();
ii=ii+1;
if (ii>2) ii=0;
t=setTimeout('imgchange()',rtime);
}
//-->
</SCRIPT>
<BODY bgcolor="#000000" onLoad="imgchange()">
<DIV align="center">
<IMG src='http://www.infoseek.co.jp/images/isj00/head/t_is … id="imgframe" style="filter:blendTrans"><BR>
<BR>
10秒ごとに画像が変化します。
</DIV>
</BODY>
</HTML>
もちろん、HTMLソースの多少の知識がないと、自分の画像に置き換えられませんが。参考↓
http://www.tohoho-web.com/wwwbeg.htm
この回答への補足
早速、新規ページ→標準モードで、
HTMLソースに↑このHTMLをコピー&ペーストしてみました。
ページ編集やプレビューに切り替えると、やっぱり
「エラーが検出されたので修正しました」となります。
ページ編集の画面は黒の背景で、上部中央に、×マークの入ったチュウリップの画像が出ます。
↑やり方は間違っていますか?
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 画像が分割されて切り替わる、ループアニメーションが作りたい 7 2023/05/27 17:12
- HTML・CSS リンクバナーのHTMLタグ。画像を変えたり、設置位置を変えるとバナー貼付け側はどう見える? 2 2023/02/01 12:01
- Excel(エクセル) ExcelのFSO(ファイルシステムオブジェクト)について学びたいのですが。。。 5 2022/12/15 18:06
- Visual Basic(VBA) エクセルマクロでアニメを作る方法を教えてください。 1 2023/02/07 14:27
- 写真 写真(画像)編集スキルを質問する時 1 2022/12/07 14:14
- PHP 掲示板のセキュリティについてアドバイスお願い致します 1 2023/08/11 20:44
- その他(映画) 背景がギュイーンとズームアウトするズームの名前と撮影方法を知りたい。 1 2023/04/15 16:00
- その他(ブラウザ) angel ブラウザってなぜアプリのクラッシュやフリーズが多いのでしょうか?? 特定のサイトにこのブ 3 2023/02/06 20:17
- その他(プログラミング・Web制作) プログラムの勉強のおすすめは 7 2022/12/09 20:09
- その他(プログラミング・Web制作) ホームページビルダー16で画像を保存したら画像がトップページ上に沢山出てきてしまいます 1 2022/12/06 14:50
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
HTMLで条件分岐はできますか?
-
画像を切り替えランダム表示
-
透過pngの透明部分以外をクリッ...
-
画像をクリックしてディレクト...
-
javaを使ってマウスオンでの画...
-
表と裏がある1枚の画像を回転す...
-
javascript ポインタ周辺のスポ...
-
画像の重なりの順序を代える方...
-
HP作成に於いての画像処理方法...
-
textareaに画像を表示したい
-
各フォルダから1枚ずつ画像をラ...
-
Photoswipeのアニメーションの変更
-
リアルタイム株価 ヤフー株価
-
スワップイメージが上手く動作...
-
seleniumbasic chrome操作について
-
jQueryで同じクラス名のものを...
-
CGI 16進数をバイナリ-に変換
-
MAX関数を使ってからLEFT JOIN...
-
OpenCVを用いたヒストグラムの...
-
imgのsrcに値を設定するには
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
textareaに画像を表示したい
-
JavaScript スライドの画像にリ...
-
HTMLで条件分岐はできますか?
-
画像ランダム表示、しかしダブ...
-
bxsliderにて読み込み後に内容...
-
画像を切り替えランダム表示
-
Gifアニメ、最後のコマに行った...
-
1枚の画像をクリックすると複数...
-
画像の重なりの順序を代える方...
-
小窓について教えて下さい。
-
スライダーを実装した場合、ペ...
-
スワップイメージが上手く動作...
-
USEMAPでの指定区域にマウスオ...
-
1枚の画像をクリックして複数の...
-
クリッカブルマップの一部分だ...
-
オンマウスで、画像切り替え+...
-
iframe内のリンク文字のマウス...
-
prettyphotoの画像表示について
-
画像の上に画像リンクを貼る方法
-
【java】背景画像を一定時間で...
おすすめ情報