script.aculo.us庫是一個跨瀏覽器庫，旨在改善網站的用戶界麵。在本文中，我們將演示多重效果。此效果用於將給定效果應用於頁麵上的多個元素。我們還可以調整效果的速度和延遲。
用法:
Effect.multiple( [element1, element2, element3, …], Effect, [options] )
或者
Effect.multiple( element, Effect, [options] )
選項：此方法在選項對象中具有兩個參數，如下所述：
- 速度：它是一個浮點值，用於指定效果列表中每個效果的延遲偏移量。默認值為0.1秒。
- delay:它是一個浮點值，指定此效果的開始延遲。默認值為0.0秒。
為了演示此函數的使用，我們編寫了一小段代碼。在其中，我們編寫了一個名為ShowEffect方法的小型JavaScript函數，該函數使用此庫的Multiple方法。下麵的示例演示了該方法。
範例1：
HTML
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src="prototype.js">
</script>
<script type="text/javascript"
src="scriptaculous.js">
</script>
<script type="text/javascript">
function ShowEffect(element) {
// Using the multiple effect with
// the delay parameter
new Effect.multiple(element,
Effect.Fade, {
delay:3.0
});
}
</script>
</head>
<body>
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h2>script.aculo.us Multiple Effect</h2>
<button onclick="ShowEffect(
['geeks_1', 'geeks_2'])">
Click me to multiple
fade the lines!
</button>
<br><br>
<div id="geeks_1">
LINE ONE TO FADE
</div><br>
<div id="geeks_2">
LINE TWO TO FADE
</div>
</body>
</html>輸出：
範例2：
HTML
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src="prototype.js">
</script>
<script type="text/javascript"
src="scriptaculous.js">
</script>
<script type="text/javascript">
// Using the multiple effect with
// the speed parameter
function ShowEffect(element) {
new Effect.multiple(element,
Effect.SwitchOff, {
speed:1.0
});
}
</script>
</head>
<body>
<h1 style="color:green;">
GeeksforGeeks
</h1>
<h2>script.aculo.us Multiple Effect</h2>
<button onclick="ShowEffect(
['geeks_1', 'geeks_2', 'geeks_3'])">
Click me to multiple fade the lines
</button>
<br><br>
<div id="geeks_1">
<div style="background-color:lightgreen;">
GeeksforGeeks
</div>
</div><br>
<div id="geeks_2">
<div style="background-color:orange;">
GeeksforGeeks
</div>
</div><br>
<div id="geeks_3">
<div style="background-color:lightblue;">
GeeksforGeeks
</div>
</div>
</body>
</html>輸出：
相關用法
注：本文由純淨天空篩選整理自Jitender_1998大神的英文原創作品 script.aculo.us Multiple Effect。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。