冒頭句省略
<title>jquery.easing demo</title>
<link rel="stylesheet" type="text/css" href= "demo_0608.css" media="screen">
<script type="text/javascript" src= "jQuery 3.6.0.js"></script>
<script type="text/javascript" src= "jquery.easing.1.3.js"></script>
<script type="text/javascript" src= "demo_0608.js"></script>
</head>
<body>
<div id="container">
<h1 id="title" class="fx">demo_jquery.easing 使用例</h1>
<h2 class="fx">Animation に付加効果</h2>
<div class="rtunbtn"><a href= "../06_08.html" target= "_top">Demo を終了して戻る</a></div>
<div id="demo">
<div id="btncl" class="btn"></div>
<span id="move">DEMO Window 700 m/sec</span>
<input id="easename" class="input" type="text" size="50" value="" />
<div id="btnst" class="btn">Action 開始</div>
<div id="take01"></div>
<div id="take02"></div>
</div>
<div id="easselect" class="fx">
<div id="eas01" class="eas"><!--easeInSine--><div class="name">easeInSine</div></div>
<div id="eas02" class="eas"><!--easeOutSine--><div class="name">easeOutSine</div></div>
<div id="eas03" class="eas"><!--easeInOutSine--><div class="name">easeInOutSine</div></div>
<div id="eas04" class="eas"><!--easeInQuad--><div class="name">easeInQuad</div></div>
<div id="eas05" class="eas"><!--easeOutQuad--><div class="name">easeOutQuad</div></div>
<div id="eas06" class="eas"><!--easeInOutQuad--><div class="name">easeInOutQuad</div></div>
<div id="eas07" class="eas"><!--easeInCubic--><div class="name">easeInCubic</div></div>
<div id="eas08" class="eas"><!--easeOutCubic--><div class="name">easeOutCubic</div></div>
<div id="eas09" class="eas"><!--easeInOutCubic--><div class="name">easeInOutCubic</div></div>
<div id="eas10" class="eas"><!--easeInQuart--><div class="name">easeInQuart</div></div>
<div id="eas11" class="eas"><!--easeOutQuart--><div class="name">easeOutQuart</div></div>
<div id="eas12" class="eas"><!--easeInOutQuart--><div class="name">easeInOutQuart</div></div>
<div id="eas13" class="eas"><!--easeInQuint--><div class="name">easeInQuint</div></div>
<div id="eas14" class="eas"><!--easeOutQuint--><div class="name">easeOutQuint</div></div>
<div id="eas15" class="eas"><!--easeInOutQuint--><div class="name">easeInOutQuint</div></div>
<div id="eas16" class="eas"><!--easeInExpo--><div class="name">easeInExpo</div></div>
<div id="eas17" class="eas"><!--easeOutExpo--><div class="name">easeOutExpo</div></div>
<div id="eas18" class="eas"><!--easeInOutExpo--><div class="name">easeInOutExpo</div></div>
<div id="eas19" class="eas"><!--easeInCirc--><div class="name">easeInCirc</div></div>
<div id="eas20" class="eas"><!--easeOutCirc--><div class="name">easeOutCirc</div></div>
<div id="eas21" class="eas"><!--easeInOutCirc--><div class="name">easeInOutCirc</div></div>
<div id="eas22" class="eas"><!--easeInBack--><div class="name">easeInBack</div></div>
<div id="eas23" class="eas"><!--easeOutBack--><div class="name">easeOutBack</div></div>
<div id="eas24" class="eas"><!--easeInOutBack--><div class="name">easeInOutBack</div></div>
<div id="eas25" class="eas"><!--easeInElastic--><div class="name">easeInElastic</div></div>
<div id="eas26" class="eas"><!--easeOutElastic--><div class="name">easeOutElastic</div></div>
<div id="eas27" class="eas"><!--easeInOutElastic--><div class="name">easeInOutElastic</div></div>
<div id="eas28" class="eas"><!--easeInBounce--><div class="name">easeInBounce</div></div>
<div id="eas29" class="eas"><!--easeOutBounce--><div class="name">easeOutBounce</div></div>
<div id="eas30" class="eas"><!--easeInOutBounce--><div class="name">easeInOutBounce</div></div>
</div>
</div>
</body>
</html>