前々回にお見せした「遅い春」のトラジションを使ったタグは
「碑炉庵」様からお借りし、画像サイズを自分用に変えてUPしました。
お借りして使ったタグの内容を他の方に聞かれたので、
私用に書き直したもの(画像サイズ500*375、サムネイル120*80)を
ここにしばらくの間表示します。
※「碑炉庵」で「神韻芸術祭を鑑賞」にhiroanさんが作品に使われたものの変形です。
(説明文の表示場所と画像サイズが違います。)
<span style="font-size:1px;color:#ffffff"><<div style="position:relative;background-color:#ffffff;width:544;height:500;">><<img id="a3" src="一番目の画像" style="position:absolute;top:25;left:25;width:500;height:375;filter:revealTrans(duration=1,transition=15);visibility:visible;z-index:2" onmouseout="this.style.visibility='hidden';z1.innerText='画像をクリック (戻る時もね!)'" onclick="this.style.visibility='hidden';z1.innerText='画像をクリック!'"/>><<div align="center" id="z1"style="position:absolute;top:420;left:26;font-size:18;color:#6633CC;width:544;height:30;padding:5px;">画像をクリック</div>><<img src="一番目の画像" style="position:absolute;top:120;left:25;width:120;height:80;z-index:1;" onclick="a3.filters.revealTrans.Apply();a3.src=this.src;a3.filters.revealTrans.transition=Math.floor(Math.random()*21)+1;a3.filters.revealTrans.play();a3.style.visibility='visible';z1.innerText='一番目の説明'" onmouseover="this.style.filter='Alpha(Opacity=60)';" onmouseout="this.style.filter='Alpha(Opacity=100)'; " />><div style="position:absolute;font-size:30px;top:50;left:10;width:500;height:50;color:#6633CC;line-height:normal;"><center>題名<center></div><<img src="二番目の画像" style="position:absolute;top:120;left:150;width:120;height:80;z-index:1;" onclick="a3.filters.revealTrans.Apply();a3.src=this.src;a3.filters.revealTrans.transition=Math.floor(Math.random()*21)+1;a3.filters.revealTrans.play();a3.style.visibility='visible';z1.innerText='二番目の説明'" onmouseover="this.style.filter='Alpha(Opacity=60)';" onmouseout="this.style.filter='Alpha(Opacity=100)'; " />><<img src="三番目の画像" style="position:absolute;top:120;left:275;width:120;height:80;z-index:1;" onclick="a3.filters.revealTrans.Apply();a3.src=this.src;a3.filters.revealTrans.transition=Math.floor(Math.random()*21)+1;a3.filters.revealTrans.play();a3.style.visibility='visible';z1.innerText='三番目の説明'" onmouseover="this.style.filter='Alpha(Opacity=60)';" onmouseout="this.style.filter='Alpha(Opacity=100)'; "/>><<img src="四番目の画像" style="position:absolute;top:120;left:400;width:120;height:80;z-index:1;" onclick="a3.filters.revealTrans.Apply();a3.src=this.src;a3.filters.revealTrans.transition=Math.floor(Math.random()*21)+1;a3.filters.revealTrans.play();a3.style.visibility='visible';z1.innerText='四番目の説明'" onmouseover="this.style.filter='Alpha(Opacity=60)';" onmouseout="this.style.filter='Alpha(Opacity=100)'; "/>><<img src="五番目の画像" style="position:absolute;top:250;left:25;width:120;height:80;z-index:1;" onclick="a3.filters.revealTrans.Apply();a3.src=this.src;a3.filters.revealTrans.transition=Math.floor(Math.random()*21)+1;a3.filters.revealTrans.play();a3.style.visibility='visible';z1.innerText='五番目の説明'" onmouseover="this.style.filter='Alpha(Opacity=60)';" onmouseout="this.style.filter='Alpha(Opacity=100)'; "/>><<img src="六番目の画像" style="position:absolute;top:250;left:150;width:120;height:80;z-index:1;" onclick="a3.filters.revealTrans.Apply();a3.src=this.src;a3.filters.revealTrans.transition=Math.floor(Math.random()*21)+1;a3.filters.revealTrans.play();a3.style.visibility='visible';z1.innerText='六番目の説明'" onmouseover="this.style.filter='Alpha(Opacity=60)';" onmouseout="this.style.filter='Alpha(Opacity=100)'; " />><<img src="七番目の画像" style="position:absolute;top:250;left:275;width:120;height:80;z-index:1;" onclick="a3.filters.revealTrans.Apply();a3.src=this.src;a3.filters.revealTrans.transition=Math.floor(Math.random()*21)+1;a3.filters.revealTrans.play();a3.style.visibility='visible';z1.innerText='七番目の説明'" onmouseover="this.style.filter='Alpha(Opacity=60)';" onmouseout="this.style.filter='Alpha(Opacity=100)'; "/>><<img src="八番目の画像" style="position:absolute;top:250;left:400;width:120;height:80;z-index:1;" onclick="a3.filters.revealTrans.Apply();a3.src=this.src;a3.filters.revealTrans.transition=Math.floor(Math.random()*21)+1;a3.filters.revealTrans.play();a3.style.visibility='visible';z1.innerText='八番目の説明'" onmouseover="this.style.filter='Alpha(Opacity=60)';" onmouseout="this.style.filter='Alpha(Opacity=100)'; "/>></span></div>
| Trackback ( )
|
|
京都白川の桜に使わせていただきました。
様々なトラジションのあるスライドショーなど、自分では決まった場所を書き換えるぐらいしかできません。
こういうものが考えられるのは才能ですね。
色々な変化のある作品(タグ)を考えて発表されるのを感心するばかりです。
koko様も素晴らしい映像を使った作品を発表なさるのでいつも鑑賞させて頂いています。
才能もアイデアも無い私は私なりになんとか頑張ります
一応「紙」にコピーしておきます。
メモ帳→「編集」→「置換」
「紙kopi」→「探す」→「置き換え」
タグの中の全角の<と>を直接入力・半角」に置き換えてます。
②500*375の画像を8枚画像フォルダーに入れます。
8枚の画像をそれぞれ「右クリック」→「ショートカットのコピー」
③タグの中の「X番目の画像」の場所(""の内側)に画像アドレスを貼り付け。
④「X番目の説明」の場所(''の内側)にその順番の説明を日本語で書き込む。
('')が片側欠けてもタグは働かないので注意して書き込んで下さい。
⑤「全部を選択」→「コピー」→「ブログの新規作成画面」→「貼り付け」、
タグの一番最後でEnterキーを押す。
⑥プレビューで画像をクリック動くのを確認して「投稿」します。
やり方は他と同じですが、書き換える場所がアドレスと説明の各8箇所で簡単だと思います。
頑張ってみます。ありがとうございました。