<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src="./javascript/prototype.js">
</script>
<script type="text/javascript"
src="./javascript/scriptaculous.js?load = effects">
</script>
<script>
function AppearEffect(element) {
new Effect.toggle(element, 'Appear', {
duration: 3
});
}
function BlindEffect(element) {
new Effect.toggle(element, 'Blind', {
duration: 3
});
}
function SlideEffect(element) {
new Effect.toggle(element, 'Slide', {
duration: 3
});
}
</script>
</head>
<body>
<div>
<Button onclick="AppearEffect('element')">
Appear Effect</Button>
<Button onclick="SlideEffect('element')">
SlideEffect</Button>
<Button onclick="BlindEffect('element')">
BlindEffect</Button>
</div>
<div id='element'>
<img src="gfg.png" />
</div>
</body>
</html>