test.html 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,minimum-scale=1,user-scalable=no">
  6. <meta content="yes" name="apple-mobile-web-app-capable">
  7. <meta content="black" name="apple-mobile-web-app-status-bar-style">
  8. <meta content="telephone=no" name="format-detection">
  9. <meta content="email=no" name="format-detection">
  10. <title>测试</title>
  11. <link rel="stylesheet" href="{MD_ROOT}static/newui/css/reset.css"/>
  12. <link rel="stylesheet" href="{MD_ROOT}static/iconfont/iconfont.css"/>
  13. <link rel="stylesheet" href="{MD_ROOT}static/jqueryweui/css/weui.min.css"/>
  14. <link rel="stylesheet" href="{MD_ROOT}static/jqueryweui/css/jquery-weui.min.css"/>
  15. <link rel="stylesheet" href="{MD_ROOT}static/newui/css/common.css"/>
  16. <script>
  17. var deviceWidth = document.documentElement.clientWidth;
  18. document.documentElement.style.fontSize = deviceWidth / 7.5 + 'px';
  19. </script>
  20. <style>
  21. html,body{height:100%;}
  22. #content{overflow-x:hidden;overflow:auto;-webkit-overflow-scrolling: touch;}
  23. #footer{height:1rem;background:#ccc;position:absolute;width:100%;}
  24. #footer input{display:block;border:none;border-radius:0;background:#fff;width:90%;margin:0 auto;height:1rem;}
  25. </style>
  26. </head>
  27. <body ontouchstart>
  28. <div id="content">
  29. <p>{$_W['fans']['from_user'])}</p>
  30. </div>
  31. <div id="footer">
  32. <input type="text" placeholder="输入" />
  33. </div>
  34. <script type="text/javascript" src="{MD_ROOT}static/js/jquery-3.1.1.min.js"></script>
  35. <script type="text/javascript" src="{MD_ROOT}static/jqueryweui/js/fastclick.js"></script>
  36. <script type="text/javascript" src="{MD_ROOT}static/jqueryweui/js/jquery-weui.min.js"></script>
  37. <script type="text/javascript">
  38. $(function(){
  39. FastClick.attach(document.body);
  40. var chatContentHeight=$(window).height()-deviceWidth / 7.5*1;
  41. $("#content").css({"height":chatContentHeight});
  42. $("#footer").css({"top":chatContentHeight});
  43. $("input").focus(function(){
  44. setTimeout(function(){
  45. },300);
  46. });
  47. })
  48. </script>
  49. </body>
  50. </html>