この記事では、9枚のグリッド写真で半透明で徐々に明らかにされる特殊効果を実現するJSの方法について説明します。参照のためにそれを共有してください。特定の実装方法は次のとおりです。
次のようにコードをコピーします：<html>
<Title> 9グリッドの写真は半透明で、徐々に効果を示しています</title>
<body>
<style type = text/css> .invisible {
フィルター：アルファ（不透明= 0）
}
</style>
<スクリプト言語= javascript1.2>
<！ -
機能高（どちら2）{
theObject = which2
Highlighting = setInterval（ "Highlightit（theObject）"、50）
}
機能低い（どちら2）{
ClearInterval（ハイライト）
which2.filters.alpha.opacity = 0
}
関数ハイライト（cur2）{
if（cur2.filters.alpha.opacity <100）
cur2.filters.alpha.opacity+= 10
else if（window.highlighting）
ClearInterval（ハイライト）
}
//->
</script>
<Table BorderColor =＃999999 Cellspacing = 8 CellPadding = 0 width = 302
border = 0> <tbody>
<tr>
<td width = 90 background = text1.gif bgcolor =＃db4d0e
高さ= 90> <a href = ""> <img
class = Invisible onmouseover = high（this）onmouseout = low（this）
src = "/images/m01.jpg" border = 0 width = 180px height = 135px> </a> </td>
<td width = 90 background = text2.gif bgcolor =＃ff9f07> <a
href = "/"> <img
class = Invisible onmouseover = high（this）onmouseout = low（this）
src = "/images/m02.jpg" border = 0 width = 180px height = 135px> </a> </td>
<td width = 90 background = text3.gif bgcolor =＃ff9f07> <a
href = ""> <img class = Invisible
onmouseover = high（this）onmouseout = low（this）src = "/migages/m03.jpg"
境界= 0幅= 180px高さ= 135px> </a> </td> </tr>
<tr>
<td background = text4.gif bgcolor =＃ff9f07> <a
href = "/"> <img
class = Invisible onmouseover = high（this）onmouseout = low（this）
src = "/images/m04.jpg" border = 0 width = 180px height = 135px> </a> </td>
<td背景= text5.gif bgcolor =＃a5d523> <a
href = "/"> <img
class = Invisible onmouseover = high（this）onmouseout = low（this）
src = "/images/m05.jpg" border = 0 width = 180px height = 135px> </a> </td>
<td background = text6.gif bgcolor =＃c56e19> <a
href = "/"> <img
class = Invisible onmouseover = high（this）onmouseout = low（this）
src = "/images/m06.jpg" border = 0 width = 180px height = 135px> </a> </td> </tr>
<tr>
<td background = text12.gif bgcolor =＃ff9f07> <a
href = "/"> <img
class = Invisible onmouseover = high（this）onmouseout = low（this）
src = "/images/m07.jpg" border = 0 width = 180px height = 135px> </a> </td>
<td background = text8.gif bgcolor =＃c56e19> <a
href = "/"> <img
class = Invisible onMouseover = high（this）onmouseout = low（this）src = "/migages/m08.jpg"
境界= 0幅= 180px高さ= 135px> </a> </td>
<td background = text7.gif bgcolor =＃c56e19> <a
href = "/"> <img
class = Invisible onmouseover = high（this）onmouseout = low（this）
src = "/images/m09.jpg" border = 0 width = 180px height = 135px> </a> </td> </tr> </tbody> </table>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。