<!DOCTYPE html>
<html lang="ja-JP">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,user-scalable=yes,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.5">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
<script type="text/javascript" src="jquery.ui.datepicker-ja.js"></script>
<script>
$(function(){
$("input.blind").click(function(){
$("p.blind").toggle("blind");
});
$("input.clip").click(function(){
$("p.clip").toggle("clip");
});
$("input.drop").click(function(){
$("p.drop").toggle("drop");
});
$("input.explode").click(function(){
$("p.explode").toggle("explode");
});
$("input.fold").click(function(){
$("p.fold").toggle("fold");
});
$("input.puff").click(function(){
$("p.puff").toggle("puff");
});
$("input.pulsate").click(function(){
$("p.pulsate").toggle("pulsate");
});
$("input.scale").click(function(){
$("p.scale").toggle("scale");
});
$("input.slide").click(function(){
$("p.slide").toggle("slide");
});
$("input.bounce").click(function(){
$("p.bounce").toggle("bounce");
});
$("input.shake").click(function(){
$("p.shake").toggle("shake");
});
$("input.highlight").click(function(){
$("p.highlight").toggle("highlight");
});
$("input.size").click(function(){
$("p.size").toggle("size");
});
});
</script>
<style>
p{
display:none;
width:200px;
height:200px;
background-color:#FF0000;
}
</style>
</head>
<body>
<input class="blind" type="button" value="blind">
<p class="blind"></p>
<hr>
<input class="clip" type="button" value="blind">
<p class="clip"></p>
<hr>
<input class="drop" type="button" value="drop">
<p class="drop"></p>
<hr>
<input class="explode" type="button" value="explode">
<p class="explode"></p>
<hr>
<input class="fold" type="button" value="fold">
<p class="fold"></p>
<hr>
<input class="puff" type="button" value="puff">
<p class="puff"></p>
<hr>
<input class="pulsate" type="button" value="pulsate">
<p class="pulsate"></p>
<hr>
<input class="scale" type="button" value="scale">
<p class="scale"></p>
<hr>
<input class="slide" type="button" value="slide">
<p class="slide"></p>
<hr>
<input class="bounce" type="button" value="bounce">
<p class="bounce"></p>
<hr>
<input class="shake" type="button" value="shake">
<p class="shake"></p>
<hr>
<input class="highlight" type="button" value="highlight">
<p class="highlight"></p>
<hr>
<input class="size" type="button" value="size">
<p class="size"></p>
<hr>
</body>