first commit

README.md

@@ -0,0 +1,29 @@
+## WebApp—H5小说阅读器功能
+
+#### 使用技术：
+
+HTML5/CSS3/JavaScript/zepto.js/jsonp/base64
+
+#### 实现功能：
+
+1.点击内容区域唤醒字体设置面板，滑动页面 面板隐藏。
+
+2.点击上一章/下一章更换内容并跳转至页面顶部。
+
+3.字体大小切换(最大20px，最小12px)。
+
+4.多种背景颜色切换。
+
+5.白天/夜间模式切换。
+
+6.可存储用户上次设置参数。
+
+#### 预览地址：
+
+
+
+#### 效果截图：
+
+![img](file:///E:/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/H5-ReadAPP/imgs/nav-bar.png?lastModify=1501305857?lastModify=1501305857)![![img](file:///E:/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/H5-ReadAPP/imgs/night.png?lastModify=1501305857)](./imgs/night.png)![](./imgs/pannel.png)
+
+![](./imgs/bg.png)![](./imgs/chapter.png)

css/reset.css

@@ -0,0 +1,25 @@
+/* 重置&默认(reset&base)(tags) */
+*[hidefocus],input,textarea,a{outline:none;}
+body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{padding:0;margin:0;}
+fieldset,img,html,body,iframe{border:0;}
+table{border-collapse:collapse;border-spacing:0;}
+li{list-style:none;}
+h1,h2,h3,h4,h5,h6{font-size:100%;}
+caption,th{font-weight:normal;font-style:normal;text-align:left;}
+em,strong{font-weight:bold;font-style:normal;}
+body,textarea,select,input,pre{font-family:arial,microsoft yahei,helvetica,sans-serif;font-size:14px;color:#555;}
+body{background:#f8f8f8;line-height:1.5em;-webkit-text-size-adjust:none;}
+a,button{cursor:pointer;}
+textarea{resize:none;overflow:auto;}
+pre{white-space:pre-wrap;}
+a{color:#333;text-decoration:none;}
+input{
+    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
+    -webkit-user-modify: read-write-plaintext-only;
+} 
+button {
+	-webkit-tap-highlight-color: rgba(255,255,255,0)
+}
+/* 布局(grids)(.g-) */ 
+/* 页面 */
+

data/data1.json

@@ -0,0 +1 @@
+{"msg": "\u6210\u529f", "result": 0, "jsonp": "http://html.read.duokan.com/mfsv2/secure/s010/60009/file?nonce=87e8e80bd9a84314badbd9230ff521b4&token=89GiFGpK01J7WSSnxHnjoefpgNPv-zrNCurl0z1EkRx4OZm4-aB36_TllcymXfewETa58Q9VLD9jJcC4MS7oa0uRTgC6JG9Poed648pU41U&sig=FxmsSqJuj3BM0pQ07XKq13UGJLY"}

data/data2.json

@@ -0,0 +1 @@
+{"msg": "\u6210\u529f", "result": 0, "jsonp": "http://html.read.duokan.com/mfsv2/secure/s010/60009/file?nonce=74c8522cfd8546fd8e2ab346366d24d0&token=89GiFGpK01J7WSSnxHnjoU435w7sJdY_EntshdzDbZLgSoyHzWOcfbMWIqJ4TfqoETa58Q9VLD9jJcC4MS7oa0uRTgC6JG9Poed648pU41U&sig=TtG7TCFv4lKLctffbvFC-iXwIoE"}

data/data3.json

@@ -0,0 +1 @@
+{"msg": "\u6210\u529f", "result": 0, "jsonp": "http://html.read.duokan.com/mfsv2/secure/s010/60009/file?nonce=1c0e98ddfdc443d48b8d4e227bf1c445&token=89GiFGpK01J7WSSnxHnjoS3l3LWUG3wT-GV19WJsgeR_-qC6G01gWwWbK91FIP3yETa58Q9VLD9jJcC4MS7oa0uRTgC6JG9Poed648pU41U&sig=YLnZSBB1As8jtzOXoFwqXVmtodA"}

data/data4.json

@@ -0,0 +1 @@
+{"msg": "\u6210\u529f", "result": 0, "jsonp": "http://html.read.duokan.com/mfsv2/secure/s010/60009/file?nonce=bc14aee4f2fe4a4c8a5c7d934f239264&token=89GiFGpK01J7WSSnxHnjodEBjNZoilVyYrYcWjlgecZ8mtQUmtRvDBg185IHWPeqETa58Q9VLD9jJcC4MS7oa0uRTgC6JG9Poed648pU41U&sig=uEajgc6opUF36h7rDo3R6hB31OI"}

js/jquery.base64.js

@@ -0,0 +1,189 @@
+/*jslint adsafe: false, bitwise: true, browser: true, cap: false, css: false,
+  debug: false, devel: true, eqeqeq: true, es5: false, evil: false,
+  forin: false, fragment: false, immed: true, laxbreak: false, newcap: true,
+  nomen: false, on: false, onevar: true, passfail: false, plusplus: true,
+  regexp: false, rhino: true, safe: false, strict: false, sub: false,
+  undef: true, white: false, widget: false, windows: false */
+/*global jQuery: false, window: false */
+"use strict";
+
+/*
+ * Original code (c) 2010 Nick Galbreath
+ * http://code.google.com/p/stringencoders/source/browse/#svn/trunk/javascript
+ *
+ * jQuery port (c) 2010 Carlo Zottmann
+ * http://github.com/carlo/jquery-base64
+ *
+ * Permission is hereby granted, free of charge, to any person
+ * obtaining a copy of this software and associated documentation
+ * files (the "Software"), to deal in the Software without
+ * restriction, including without limitation the rights to use,
+ * copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the
+ * Software is furnished to do so, subject to the following
+ * conditions:
+ *
+ * The above copyright notice and this permission notice shall be
+ * included in all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+ * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+ * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+ * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+ * OTHER DEALINGS IN THE SOFTWARE.
+*/
+
+/* base64 encode/decode compatible with window.btoa/atob
+ *
+ * window.atob/btoa is a Firefox extension to convert binary data (the "b")
+ * to base64 (ascii, the "a").
+ *
+ * It is also found in Safari and Chrome.  It is not available in IE.
+ *
+ * if (!window.btoa) window.btoa = $.base64.encode
+ * if (!window.atob) window.atob = $.base64.decode
+ *
+ * The original spec's for atob/btoa are a bit lacking
+ * https://developer.mozilla.org/en/DOM/window.atob
+ * https://developer.mozilla.org/en/DOM/window.btoa
+ *
+ * window.btoa and $.base64.encode takes a string where charCodeAt is [0,255]
+ * If any character is not [0,255], then an exception is thrown.
+ *
+ * window.atob and $.base64.decode take a base64-encoded string
+ * If the input length is not a multiple of 4, or contains invalid characters
+ *   then an exception is thrown.
+ */
+
+jQuery.base64 = ( function( $ ) {
+
+  var _PADCHAR = "=",
+    _ALPHA = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/",
+    _VERSION = "1.0";
+
+
+  function _getbyte64( s, i ) {
+    // This is oddly fast, except on Chrome/V8.
+    // Minimal or no improvement in performance by using a
+    // object with properties mapping chars to value (eg. 'A': 0)
+
+    var idx = _ALPHA.indexOf( s.charAt( i ) );
+
+    if ( idx === -1 ) {
+      throw "Cannot decode base64";
+    }
+
+    return idx;
+  }
+
+
+  function _decode( s ) {
+    var pads = 0,
+      i,
+      b10,
+      imax = s.length,
+      x = [];
+
+    s = String( s );
+
+    if ( imax === 0 ) {
+      return s;
+    }
+
+    if ( imax % 4 !== 0 ) {
+      throw "Cannot decode base64";
+    }
+
+    if ( s.charAt( imax - 1 ) === _PADCHAR ) {
+      pads = 1;
+
+      if ( s.charAt( imax - 2 ) === _PADCHAR ) {
+	pads = 2;
+      }
+
+      // either way, we want to ignore this last block
+      imax -= 4;
+    }
+
+    for ( i = 0; i < imax; i += 4 ) {
+      b10 = ( _getbyte64( s, i ) << 18 ) | ( _getbyte64( s, i + 1 ) << 12 ) | ( _getbyte64( s, i + 2 ) << 6 ) | _getbyte64( s, i + 3 );
+      x.push( String.fromCharCode( b10 >> 16, ( b10 >> 8 ) & 0xff, b10 & 0xff ) );
+    }
+
+    switch ( pads ) {
+      case 1:
+	b10 = ( _getbyte64( s, i ) << 18 ) | ( _getbyte64( s, i + 1 ) << 12 ) | ( _getbyte64( s, i + 2 ) << 6 );
+	x.push( String.fromCharCode( b10 >> 16, ( b10 >> 8 ) & 0xff ) );
+	break;
+
+      case 2:
+	b10 = ( _getbyte64( s, i ) << 18) | ( _getbyte64( s, i + 1 ) << 12 );
+	x.push( String.fromCharCode( b10 >> 16 ) );
+	break;
+    }
+
+    return x.join( "" );
+  }
+
+
+  function _getbyte( s, i ) {
+    var x = s.charCodeAt( i );
+
+    if ( x > 255 ) {
+      throw "INVALID_CHARACTER_ERR: DOM Exception 5";
+    }
+
+    return x;
+  }
+
+
+  function _encode( s ) {
+    if ( arguments.length !== 1 ) {
+      throw "SyntaxError: exactly one argument required";
+    }
+
+    s = String( s );
+
+    var i,
+      b10,
+      x = [],
+      imax = s.length - s.length % 3;
+
+    if ( s.length === 0 ) {
+      return s;
+    }
+
+    for ( i = 0; i < imax; i += 3 ) {
+      b10 = ( _getbyte( s, i ) << 16 ) | ( _getbyte( s, i + 1 ) << 8 ) | _getbyte( s, i + 2 );
+      x.push( _ALPHA.charAt( b10 >> 18 ) );
+      x.push( _ALPHA.charAt( ( b10 >> 12 ) & 0x3F ) );
+      x.push( _ALPHA.charAt( ( b10 >> 6 ) & 0x3f ) );
+      x.push( _ALPHA.charAt( b10 & 0x3f ) );
+    }
+
+    switch ( s.length - imax ) {
+      case 1:
+	b10 = _getbyte( s, i ) << 16;
+	x.push( _ALPHA.charAt( b10 >> 18 ) + _ALPHA.charAt( ( b10 >> 12 ) & 0x3F ) + _PADCHAR + _PADCHAR );
+	break;
+
+      case 2:
+	b10 = ( _getbyte( s, i ) << 16 ) | ( _getbyte( s, i + 1 ) << 8 );
+	x.push( _ALPHA.charAt( b10 >> 18 ) + _ALPHA.charAt( ( b10 >> 12 ) & 0x3F ) + _ALPHA.charAt( ( b10 >> 6 ) & 0x3f ) + _PADCHAR );
+	break;
+    }
+
+    return x.join( "" );
+  }
+
+
+  return {
+    decode: _decode,
+    encode: _encode,
+    VERSION: _VERSION
+  };
+
+}( jQuery ) );