topical media & game development
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

talk show tell print

sample-mobile-sg.htm / htm



  <!DOCTYPE HTML>
  <html manifest="manifest.appcache">
  <head>
  <meta charset="UTF-8">
  <title>(mobile) SG</title>
  <meta name="viewport" content="width=device-width,user-scalable=no">
  <link rel="stylesheet" href="mobile-js-jquery-congress-jquery.mobile-1.0.css" />
  <link rel="stylesheet" href="mobile-js-jquery-congress-index.css" />
  <script src="mobile-js-jquery-congress-jquery.js"></script>
  <script src="mobile-js-jquery-congress-index.js"></script>
  <script src="mobile-js-jquery-congress-jquery.mobile-1.0.js"></script>
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <link rel="apple-touch-icon" sizes="80x80" href="mobile-js-jquery-congress-icons-icon80.png">
  <link rel="apple-touch-icon" href="mobile-js-jquery-congress-images-icon57.png" sizes="57x57">
  <link rel="apple-touch-icon" href="mobile-js-jquery-congress-images-icon114.png" sizes="114x114">
  <link rel="apple-touch-icon" href="mobile-js-jquery-congress-images-icon72.png" sizes="72x72">
  <link rel="apple-touch-icon-precomposed" sizes="android-only" href="mobile-js-jquery-congress-images-icon57.png">
  </head>
  
  <body>
  
  <!-- **** HOME PAGE **** -->
  
  <div data-role="page" id="home">
  
    <div data-role="content">
      <p><img src="@walk.jpg" alt="jQM Conference" width="60" height="60" align="middle"></p>
      <h3>2013</h3>
      <div class="ui-grid-a">
        <div class="ui-block-a"><a href="https://twitter.com/CreaTeSG" data-role="button" data-theme="b" target="_blank">twitter</a></div>
        <div class="ui-block-b"><a href="https://www.facebook.com/groups/seriousgamification" data-role="button" data-theme="b" target="_blank">facebook</a></div>
      </div>
    </div>
    
    <div data-role="footer" data-position="fixed" data-id="toolbar">
      <div data-role="navbar">
        <ul>
          <li><a class="ui-btn-active" href="#home" data-icon="home" data-transition="fade">home</a></li>
          <li><a href="#sessions" data-icon="grid" data-transition="fade">sessions</a></li>
          <li><a href="#where" data-icon="info" data-transition="fade">where</a></li>
          <li><a href="#about" data-icon="star" data-transition="fade">about</a></li>
          <li><a href="mobile-js-jquery-congress-feedback.htm" data-icon="plus" data-rel="dialog">feedback</a></li>
        </ul>
      </div>
    </div>
    
  </div>
  
  <!-- **** SESSIONS PAGE **** -->
  
  <div data-role="page" id="sessions">
  
    <div data-role="header">
      <h1>sessions</h1>
      <a href='javascript:refresh();' data-icon="refresh" id="refresh" data-theme="c" class="ui-btn-left" data-iconpos="notext"></a> 
    </div>
    
    <div data-role="content">
      <p id="console"></p>
      <ul data-role="list-view" data-inset="true" id="slots">
      <li> <a href=../serious/@s5-session-1.html>session 1</a>
      </ul>
    </div>
    
    <div data-role="footer" data-position="fixed" data-id="toolbar">
      <div data-role="navbar">
        <ul>
          <li><a href="#home" data-icon="home" data-transition="fade">Home</a></li>
          <li><a class="ui-btn-active" href="#sessions" data-icon="grid" data-transition="fade">sessions</a></li>
          <li><a href="#where" data-icon="info" data-transition="fade">where</a></li>
          <li><a href="#about" data-icon="star" data-transition="fade">about</a></li>
          <li><a href="feedback.html" data-icon="plus" data-rel="dialog">Feedback</a></li>
        </ul>
      </div>
    </div>
    
  </div>
  
  <!-- **** SESSION'S DETAILS PAGE **** -->
  
  <div data-role="page" id="details" data-add-back-btn="true">
  
    <div data-role="header">
      <h1>session detail(s)</h1>
    </div>
    
    <div data-role="content">
      <div id="sessionInfo">
      <iframe src=../serious/@s5-present.html></iframe>
      </div>
    </div>
    
    <div data-role="footer" data-position="fixed" data-id="toolbar">
      <div data-role="navbar">
        <ul>
          <li><a href="#home" data-icon="home" data-transition="fade">Home</a></li>
          <li><a href="#sessions" data-icon="grid" data-transition="fade">session(s)</a></li>
          <li><a href="#where" data-icon="info" data-transition="fade">where</a></li>
          <li><a href="#about" data-icon="star" data-transition="fade">about</a></li>
          <li><a href="feedback.html" data-icon="plus" data-rel="dialog">feedback</a></li>
        </ul>
      </div>
    </div>
    
  </div>
  
  <!-- **** WHERE PAGE **** -->
  
  <div data-role="page" id="where">
  
    <div data-role="header">
      <h1>where</h1>
    </div>
  
    <div data-role="content">
       ...
       <div id="map">     
       </div>
    </div>
  
    <div data-role="footer" data-position="fixed" data-id="toolbar">
      <div data-role="navbar">
        <ul>
          <li><a href="#home" data-icon="home" data-transition="fade">home</a></li>
          <li><a href="#sessions" data-icon="grid" data-transition="fade">sessions</a></li>
          <li><a class="ui-btn-active" href="#where" data-icon="info" data-transition="fade">where</a></li>
          <li><a href="#about" data-icon="star" data-transition="fade">about</a></li>
          <li><a href="../serious/feedback.html" data-icon="plus" data-rel="dialog">feedback</a></li>
        </ul>
      </div>
    </div>
  
  </div>
  
  <!-- **** ABOUT PAGE **** -->
  
  <div data-role="page" id="about">
  
    <div data-role="header">
      <h1>about</h1>
    </div>
  
    <div data-role="content">
      <div data-role="collapsible">
              <h3>organization</h3>
          <p><a href=http://create.eliens.net>creative technology</a></p>
      </div>
      <div data-role="collapsible">
              <h3>dates</h3>
          <p>starting april 22, 2013</p>
      </div>    
      <div data-role="collapsible">
              <h3>history</h3>
          <p> there are only <a href=http://create/eliens.net/@s5-future,html>future(s)</a></p>
      </div>    
    </div>
    
    <div data-role="footer" data-position="fixed" data-id="toolbar">
      <div data-role="navbar">
        <ul>
          <li><a href="#home" data-icon="home" data-transition="fade">home</a></li>
          <li><a href="#sessions" data-icon="grid" data-transition="fade">Sessions</a></li>
          <li><a href="#where" data-icon="info" data-transition="fade">Where</a></li>
          <li><a class="ui-btn-active" href="#about" data-icon="star" data-transition="fade">about</a></li>
          <li><a href="feedback.html" data-icon="help" data-transition="fade">feedback</a></li>
        </ul>
      </div>
    </div>
    
  </div>
  
  <!-- **** iOS INSTALLATION DIALOG PAGE **** -->
  <div data-role="page" id="ios">
  
    <div data-role="header">
      <h1>installation</h1>
    </div>
    
    <div data-role="content">
      <p id="consoleInstall">complete the installation</p>
      <div id="install">
           <p>to finish the installation, you must add this webapp to your Home Screen. To do that, touch the arrow and select "Add to Home Screen"</p>
      </div>  
      <a href="javascript:openWithoutInstallation()" class="openWithoutInstall">Open without installation</a>
    </div>
  
  </div>
  
  </body>
  </html>
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.