jq 點選從下往上滑彈出層
阿新 • • 發佈：2019-02-19
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>jq 從下往上滑彈出層</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="format-detection" content="telephone=no"> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> <style> div{ width:100%; height:0px; position:absolute; right:0; bottom:0px; background: pink; } </style> </head> <body> <input type="button" value="按鈕" /> <div id="div1"> 123 </div> <script type="text/javascript"> $(function(){ $('body').click(function(){//mouseover滑鼠移入 $('#div1').animate({height:'300px'},1500);//高度、時間 }); }); </script> </body> </html>