script.aculo.us - Appear 效果
说明
使元素显示。如果元素之前在元素的 style 属性中设置为 display:none;，则效果将自动显示元素。
这意味着必须在对象的 style 属性中设置 display，而不是在 CSS、文档的头部或链接文件中设置。换句话说，如果在 style 标签或链接的 CSS 文件中设置了 display:none;，则此效果将不起作用。
注意 − 此效果与 Opacity 效果非常相似，但有细微的差别。 Appear 效果将确保元素在调整不透明度之前是文档流的一部分。
因此，如果您希望元素在不透明度更改时仍是文档显示的一部分，请使用不透明度效果。要从文档中删除和替换元素作为淡出/淡入序列的一部分，请使用 Appear 效果而不是 Opacity。
语法
您可以使用以下两种形式之一来使用此效果 −
new Effect.Appear('id_of_element', [options]);
或
new Effect.Appear(element, [options]);
效果特定参数
此效果除了通用参数外没有任何其他参数。
示例
<html>
<head>
<title>script.aculo.us examples</title>
<script type = "text/javascript" src = "/javascript/prototype.js"></script>
<script type = "text/javascript" src = "/javascript/scriptaculous.js?load = effects" ></script>
<script type = "text/javascript">
function ShowEffect(element){
new Effect.Appear(element, {duration:1, from:0, to:1.0});
}
function HideEffect(element){
new Effect.Appear(element, {duration:1, from:1.0, to:0});
}
</script>
</head>
<body>
<div onclick = "ShowEffect('hideshow')">
Click me to see the line!
</div>
<br />
<div onclick = "HideEffect('hideshow')">
Click me to hide the line!
</div>
<br />
<div id = "hideshow">
LINE TO HIDE AND TO SHOW
</div>
</body>
</html>
这将产生以下结果 −
scriptaculous_effects.html
