便利eelife Java Script

   戻る

テーブルの背景をグラデーションします。




サンプルソース
<!--HTMLタグ </HEAD>の下に挿入してください。-->
<BODY >
<TABLE>
<TBODY>
<TR>
<TD height="139" width="696" id="myOBJ" style="filter:progid:DXImageTransform.Microsoft.Gradient
(GradientType=1,startColorstr=#ffffff, endColorstr=#000000)">テーブルの背景をグラデーションします
<FORM name="myFORM"><BR>
<SELECT name="list">
<OPTION value="#00ff00" selected>Lime</OPTION>
<OPTION value="#ff0000">Red</OPTION>
<OPTION value="#0000ff">Blue</OPTION>
<OPTION value="#000000">Black</OPTION>
<OPTION value="#808080">Gray</OPTION>
<OPTION value="#C0C0C0">Silver</OPTION>
<OPTION value="#ffffff">White</OPTION>
<OPTION value="#800000">Maroon</OPTION>
<OPTION value="#008000">Green</OPTION>
<OPTION value="#000080">Navy</OPTION>
<OPTION value="#800080">Purple</OPTION>
<OPTION value="#808000">Plive</OPTION>
<OPTION value="#008080">Teal</OPTION>
<OPTION value="#ffff00">Yellow</OPTION>
<OPTION value="#ff00ff">Fuchsia</OPTION>
<OPTION value="#00ffff">Aqua</OPTION>
</SELECT><INPUT onclick="chgsrtclr()" type="button" value="最初の色">
<INPUT onclick="chgendclr()" type="button" value="最後の色">
<INPUT onclick="kaisi()" type="button" value="開始">
<INPUT type="button" onclick="chg()" value="方向"></FORM>
</TD>
</TR>
</TBODY>
</TABLE>
</BODY>
<!--Javascript <HEAD>と</HEAD>の間に挿入してください。 -->
<SCRIPT language="JavaScript">
<!--eelife
srtclr ="#ffffff";
endclr ="#000000";
flag=0;

function chgsrtclr(){
bgclr = document.myFORM.list.selectedIndex;
srtclr = document.myFORM.list.options[bgclr].value;
}
function chgendclr(){
bgclr = document.myFORM.list.selectedIndex;
endclr = document.myFORM.list.options[bgclr].value;
}

function kaisi(){
myOBJ.filters[0].StartColorStr = srtclr;
myOBJ.filters[0].EndColorStr = endclr;
}

function chg(){
myOBJ.filters[0].GradientType=flag;
flag ^= 1;
}

// -->
</SCRIPT>
コメント