画像効果T

◆画像効果T◆
 ┣１.画像効果１　　　　　・・・　　Box inの動作をする。
┣２.画像効果２　　　　　・・・　　Box outの動作をする。
 ┣３.画像効果３　　　　　・・・　　Circle inの動作をする。
┣４.画像効果４　　　　　・・・　　Circle outの動作をする。
 ┣５.画像効果５　　　　　・・・　　Wipe upの動作をする。
┣６.画像効果６　　　　　・・・　　Wipe downの動作をする。
 ┣７.画像効果７　　　　　・・・　　Wipe rightの動作をする。
┣８.画像効果８　　　　　・・・　　Wipe leftの動作をする。
 ┣９.画像効果９　　　　　・・・　　Vertical blindsの動作をする。
┗１０.画像効果１０　　　　　・・・　　Horizontal blindsの動作をする。

　

画像効果１

■■１■■
[概要]
Box inの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え１</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=0)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果２

■■２■■
[概要]
Box outの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え２</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=1)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果３

■■３■■
[概要]
Circle inの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え３</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=2)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果４

■■４■■
[概要]
Circle outの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え４</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=3)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果５

■■５■■
[概要]
Wipe upの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え５</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=4)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果６

■■６■■
[概要]
Wipe downの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え６</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=5)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果７

■■７■■
[概要]
Wipe writeの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え７</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=6)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果８

■■８■■
[概要]
Wipe leftの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え８</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=7)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果９

■■９■■
[概要]
Vertical blindsの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え９</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=8)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　

画像効果１０

■■１０■■
[概要]
Horizontal blindsの動作をする。

[参照]

[ソース]
 <HTML>
<TITLE>画像切り替え１０</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
//効果の指定と実行
function transitions(){
    //時間と効果の設定
    img1.style.filter = "revealTrans(duration=3.0,transition=9)";
    img1.style.visibility = "hidden";
    img1.filters[0].apply();
    img1.style.visibility = "visible";
    img1.filters[0].Play();
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<IMG src="画像のURL" id="img1" style={visibility:hidden;}><P>
<INPUT type="button" value="効果" onClick="transitions()">
</BODY>
</HTML>

※赤は変更点
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。

　戻る