Este artigo descreve o método do JS para obter efeitos especiais translúcidos e gradualmente revelando em nove imagens da grade. Compartilhe para sua referência. O método de implementação específico é o seguinte:
Copie o código da seguinte forma: <html>
<título> Nine-grid Pictures Translúcida e gradualmente mostrando efeito </ititure>
<Body>
<Tipo de estilo = text/css> .invisible {
Filtro: Alpha (Opacity = 0)
}
</Style>
<Idioma do script = javascript1.2>
<!-
função alta (qual2) {
theObject = what2
destacando = setInterval ("destacar (TheObject)", 50)
}
função baixa (qual2) {
ClearInterval (destaque)
que2.filters.alpha.Opacity = 0
}
Função HighlightIt (Cur2) {
if (cur2.filters.alpha.Opacity <100)
cur2.filters.alpha.Opacity+= 10
caso contrário, se (Window.Highlighting)
ClearInterval (destaque)
}
//->
</Script>
<Tabela borderColor =#999999 CellSpacing = 8 CellPadding = 0 Larth = 302
Border = 0> <Tbody>
<tr>
<Td width = 90 background = text1.gif bgcolor =#db4d0e
altura = 90> <a href = ""> <img
class = invisível onMouseOver = alto (this) onMouseOut = baixo (this)
src = "/imagens/m01.jpg" borda = 0 largura = 180px altura = 135px> </a> </td>
<Td width = 90 background = text2.gif bgcolor =#ff9f07> <a
href = "/"> <img
class = invisível onMouseOver = alto (this) onMouseOut = baixo (this)
src = "/imagens/m02.jpg" borda = 0 largura = 180px altura = 135px> </a> </td>
<Td width = 90 background = text3.gif bgcolor =#ff9f07> <a
href = ""> <IMG Class = invisível
onMouseOver = alto (this) onMouseOut = baixo (this) src = "/imagens/m03.jpg"
borda = 0 largura = 180px altura = 135px> </a> </td> </tr>
<tr>
<TD Background = text4.gif bgcolor =#ff9f07> <a
href = "/"> <img
class = invisível onMouseOver = alto (this) onMouseOut = baixo (this)
src = "/imagens/m04.jpg" borda = 0 largura = 180px altura = 135px> </a> </td>
<Td background = text5.gif bgcolor =#a5d523> <a
href = "/"> <img
class = invisível onMouseOver = alto (this) onMouseOut = baixo (this)
src = "/imagens/m05.jpg" borda = 0 largura = 180px altura = 135px> </a> </td>
<Td background = text6.gif bgcolor =#c56e19> <a
href = "/"> <img
class = invisível onMouseOver = alto (this) onMouseOut = baixo (this)
src = "/imagens/m06.jpg" borda = 0 largura = 180px altura = 135px> </a> </td> </tr>
<tr>
<TD Background = text12.gif bgcolor =#ff9f07> <a
href = "/"> <img
class = invisível onMouseOver = alto (this) onMouseOut = baixo (this)
src = "/imagens/m07.jpg" borda = 0 largura = 180px altura = 135px> </a> </td>
<Td background = text8.gif bgcolor =#c56e19> <a
href = "/"> <img
class = invisível onMouseOver = alto (this) onMouseOut = baixo (this) src = "/imagens/m08.jpg"
borda = 0 largura = 180px altura = 135px> </a> </td>
<Td background = text7.gif bgcolor =#c56e19> <a
href = "/"> <img
class = invisível onMouseOver = alto (this) onMouseOut = baixo (this)
src = "/imagens/m09.jpg" borda = 0 largura = 180px altura = 135px> </a> </td> </tr> </tbody> </ table>
</body>
</html>
Espero que este artigo seja útil para a programação JavaScript de todos.