en/gesture/index.html

   1 <!doctype html>
   2 <html>
   3   <head>
   4     <meta charset="utf-8">
   5     <meta name="viewport" content="width=device-width, initial-scale=1" />
   6
   7     <link rel="stylesheet" href="../style.css#" type="text/css" />
   8     <title>Gestures</title>
   9     <script type="text/javascript">
  10       function findLang(){
  11         let href = location.href;
  12         for(let i=href.length-1;i>0;i--){
  13           if('/'==href.charAt(i) && '/'==href.charAt(i-3))
  14             return i;
  15         }
  16         return 0;
  17       }
  18       function nav2(page){
  19         let i = findLang();
  20         location.href = location.href.substring(0,i+1)+page;
  21       }
  22       function nav2Lang(lang){
  23         let i = findLang();
  24         let href = location.href;
  25         location.href = location.href.substring(0,i-2)+lang+location.href.substring(i);
  26       }
  27     </script>
  28   </head>
  29   <body>
  30     <header class='header'>
  31       <a class="logo" href="javascript:void(0)" onclick="return nav2('index.html')">Home</a> <a class="logo" href="javascript:void(0)" onclick="return nav2('tags/index.html')">Tags</a>
  32
  33
  34           <a class="logo" href="javascript:void(0)" onclick="return nav2Lang('zh')">简体中文</a>
  35
  36
  37       <nav>
  38       </nav>
  39     </header>
  40     <br />
  41
  42 <div class="container">
  43   <h1 class="title">Gestures
  44     <br>
  45     <span class="subtitle"></span>
  46   </h1>
  47   <ul class="tags">
  48
  49   </ul>
  50   <p>Swipe down from the top to show the address bar; swipe up to the top to hide the address bar. Swipe down to the bottom to hide the toolbar with option &quot;swipe to hide tools&quot;; swipe on the bottom corners to show the toolbar.</p>
  51 <p>Swipe left/right near the toolbar to switch window; fling left/right to switch to the last/first window.</p>
  52 <p>Swiping on the top part of content window (near the top address bar by default) triggers corresponding link in the file &quot;default.gesture&quot;, which has the same format as <a href="../links/index.html">default.link</a>.</p>
  53 <p>The algorithm to match swiping gesture to a line in the file &quot;default.gesture&quot; is as follows:</p>
  54 <ul>
  55 <li>Divide the screen width to three parts evenly, assign each part with a number 0, 1, 2 respectively.</li>
  56 <li>Assume &quot;s&quot; and &quot;e&quot; are the above defined numbers for the gesture start point and end point. Let &quot;linenumber = 3*s+e&quot; , if it is equal to 4 and the gesture's first direction is left, then change it to be 9.</li>
  57 <li>For turning back and forth, add &quot;10&quot; each time.</li>
  58 </ul>
  59 <p>The final line number will match the corresponding line in &quot;default.gesture&quot;, 0 to the first line, ...</p>
  60 <p>&quot;default.gesture2&quot; is for the right side gesturs and the algorithm is similar to &quot;default.gesture&quot;.</p>
  61 <p>Example links:<br>
  62 Toggle fullscreen::0003<br>
  63 back:javascript:history.back()<br>
  64 forward:javascript:history.forward()<br>
  65 back2:javascript:history.go(-2)</p>
  66
  67 </div>
  68 <p>Last Modified: 24 September 2022<br>
  69 add en gesture.md<br>
  70 <pre></pre>
  71 </p>
  72
  73 <script id='jsgiscus'
  74   src='https://giscus.app/client.js'
  75   data-repo="torappinfo/uweb"
  76   data-repo-id="MDEwOlJlcG9zaXRvcnkzMDIyMDU3MjE="
  77   data-category="Announcements"
  78   data-category-id="DIC_kwDOEgNLGc4CQjsh"
  79   data-mapping="title"
  80   data-strict="0"
  81   data-reactions-enabled="1"
  82   data-emit-metadata="0"
  83   data-input-position="top"
  84   data-theme="light"
  85   data-lang="en"
  86   data-loading="lazy"
  87   crossorigin="anonymous" async>
  88 </script>
  89
  90   </body>
  91 </html>