diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 00000000..810ca513 Binary files /dev/null and b/.DS_Store differ diff --git a/_config.yml b/_config.yml index 3cfaf095..419bfff1 100644 --- a/_config.yml +++ b/_config.yml @@ -1,12 +1,10 @@ # Site settings -title: Your awesome title -email: your-email@domain.com +title: 半壶纱 +email: box.zhou@foxmail.com description: > # this means to ignore newlines until "baseurl:" - Write an awesome description for your new site here. You can edit this - line in _config.yml. It will appear in your document head meta (for - Google search results) and in your feed.xml site description. + 倘若我心中的山水 你眼中都看到 baseurl: "" # the subpath of your site, e.g. /blog/ -url: "http://yourdomain.com" # the base hostname & protocol for your site +url: "http://yueting.site" # the base hostname & protocol for your site # Sidebar filter diff --git a/_posts/2015-03-08-welcome-to-jekyll.markdown b/_posts/2015-03-08-welcome-to-jekyll.markdown deleted file mode 100644 index 03c25170..00000000 --- a/_posts/2015-03-08-welcome-to-jekyll.markdown +++ /dev/null @@ -1,26 +0,0 @@ ---- -layout: post -title: "Welcome to Jekyll!" -date: 2015-03-08 22:21:49 -categories: Jekyll Update -tags: Jekyll Update ---- -You’ll find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `jekyll serve`, which launches a web server and auto-regenerates your site when a file is updated. - -To add new posts, simply add a file in the `_posts` directory that follows the convention `YYYY-MM-DD-name-of-post.ext` and includes the necessary front matter. Take a look at the source for this post to get an idea about how it works. - -Jekyll also offers powerful support for code snippets: - -{% highlight ruby %} -def print_hi(name) - puts "Hi, #{name}" -end -print_hi('Tom') -#=> prints 'Hi, Tom' to STDOUT. -{% endhighlight %} - -Check out the [Jekyll docs][jekyll] for more info on how to get the most out of Jekyll. File all bugs/feature requests at [Jekyll’s GitHub repo][jekyll-gh]. If you have questions, you can ask them on [Jekyll’s dedicated Help repository][jekyll-help]. - -[jekyll]: http://jekyllrb.com -[jekyll-gh]: https://github.com/jekyll/jekyll -[jekyll-help]: https://github.com/jekyll/jekyll-help diff --git a/_posts/2016-01-01-animate.md b/_posts/2016-01-01-animate.md new file mode 100644 index 00000000..2eafc353 --- /dev/null +++ b/_posts/2016-01-01-animate.md @@ -0,0 +1,21 @@ +--- +layout: post +title: JQ animate 动画方法的参数是对象 +tags: Jq +--- + +jq animate 动画方法的参数是对象 ： +比如: + + +当调用jq 的animate方法时 + +在 animat方法里面 obj.height 可以直接拿到 height。 + +如下： +```js +function animate(obj){ + //使用js设置 当前指定元素的高 + document.getElementById("id").style.height=obj.height; +} +``` diff --git a/_posts/2016-01-01-iframe.md b/_posts/2016-01-01-iframe.md new file mode 100644 index 00000000..b8ce7190 --- /dev/null +++ b/_posts/2016-01-01-iframe.md @@ -0,0 +1,26 @@ +--- +layout: post +title: JS 设置iframe页面高度 +tags: Js +--- + +js: +```js +//首先写个方法给指定的iframe 调用 +function SetIframeHeight(obj) {//obj为iframe 对象 + var iwin = obj; + window.onload=function(){//页面加载完才执行此方法,古老的方法是这个样子去写的 if (document.getElementById) ，建议使用window.onload + if (iwin && !window.opera) {//if iwin 存在 并且不是opera浏览器 + if (iwin .contentDocument && iwin .contentDocument.body.offsetHeight) iwin .height = iwin .contentDocument.body.offsetHeight + 20; // FF + else if (iwin .Document && iwin .Document.body.scrollHeight) iwin .height = iwin .Document.body.scrollHeight + 10; // IE + } else { + if (iwin .contentWindow.document && iwin .contentWindow.document.body.scrollHeight) iwin .height = iwin .contentWindow.document.body.scrollHeight; // Opera + } + } +} +``` + +html调用: +```html + +``` diff --git a/_posts/2016-01-01-memcached.md b/_posts/2016-01-01-memcached.md new file mode 100644 index 00000000..331ed760 --- /dev/null +++ b/_posts/2016-01-01-memcached.md @@ -0,0 +1,54 @@ +--- +layout: post +title: Windows环境给php安装memcached +tags: PHP +--- + +### 1.php 5.6.15 64位系统 +解压压缩包 +找到memcached-win64文件夹 复制整个文件夹到指定目的,比如 D:/memcached-win64 （可以自己改掉文件夹名字） +打开 cmd 运行 ： D:\memcached-win64\memcached.exe -d install +回车 没报错 +```txt +D:\memcached-win64\memcached.exe -d start +``` + +回车 没报错 + 找到电脑本地服务 memcached 已启动 那就是安装成功了 + + +### 2.找到dll文件夹 里面有php需要的memcache.dll 文件 +这里用的是php_memcache-3.0.8-5.6-ts-vc11-x86 文件夹里面的 dll +文件夹里面没有合适的dll 去下载： http://pecl.php.net/package/memcache/3.0.8/windows +把php_memcache-3.0.8-5.6-ts-vc11-x86 解压 +拿到里面的 php_memcache.dll 文件 +放到php的安装目录的 ext文件夹下 +这个文件夹放的都是php的dll文件 + +### 3.在php配置文件里面添加memcached的扩展 +在php的安装目录下找到 php.ini 文件 +把 ;extension=php_memcache.dll 的; 去掉 + +如果没有 +在里面添加 +```txt +extension=php_memcache.dll +``` +//重启apache + +### 4.在Apache环境下 放个 index.php +内容如下： +```php + +``` +5.浏览器访问localhost +在浏览器页面上找到 memcache + +找到就成功了 没找到就不知道是是什么鬼了 + +O(∩_∩)O哈哈~ + + +64位系统安装memcached diff --git a/_posts/2016-01-02-utf.md b/_posts/2016-01-02-utf.md new file mode 100644 index 00000000..dbda66fd --- /dev/null +++ b/_posts/2016-01-02-utf.md @@ -0,0 +1,17 @@ +--- +layout: post +title: JQ ajax load()方法加载的服务器文本是乱码？ +tags: Jq +--- + +怎么解决？ + +加载的文本文件改成 utf-8;-->跟页面编码一样就可以了。 + +```js +$("div").load("dome.txt",function(responeTxt,statusTxt,xrt){ +//responeTxt:返回的文本 +//statusTxt :状态文本 成功或者失败 +//xrt：xmlhttprequest的所有状态信息 +}) +``` diff --git a/_posts/2017-08-07-theChromeDevelopmentTools.markdown b/_posts/2017-08-07-theChromeDevelopmentTools.markdown new file mode 100644 index 00000000..c8c2d462 --- /dev/null +++ b/_posts/2017-08-07-theChromeDevelopmentTools.markdown @@ -0,0 +1,56 @@ +--- +layout: post +title: Chrome开发工具 +tags: 工具 +--- +#### 控制台切换主题（黑／白） + +控制台三点图标 setting > preferences > Appearance > Theme ： 可以选（light白/dark黑） + +#### 将打印的对象存储为全局变量 + +有时候想在控制台操作一些数据，结果太麻烦，这时候只需要在console.log() 打印之后鼠标右键 > Store As Global Variable就可以存储为一个temp1的全局变量，然后随君操作。 + +#### 动画工具 Animations + +控制台三点图标 more tools > Animations 可以开启动画调试工具、可以暂停、放慢查看动画的运行轨迹，动画查看器允许你单独控制每个属性的时间曲线！ + +#### 模拟元素伪态 + +通过点击样式窗口右上角的:hover图标，你可以打开元素状态模拟工具。 +该工具可以让你模拟一个元素的hover,active,focused和visited伪态，并且看到不同伪态的相关样式与选择符。如果要为这些伪态添加样式，可以添加一个新的选择器（使用“+”图标），并将:添加到选择器的结尾。 + +#### 美化CSS和JavaScript + +调试、浏览压缩后的JavaScript和CSS是一件非常困难的事情，好在调试工具让这件事情变得容易了一些。 +在“Source”的标签栏打开了一个压缩的文档后，你可以点击左下角的花括号logo，之后调试工具就会将代码进行格式化处理。 +尽管在压缩过程中丢失了一些信息（例如变量名）,该工具对调试CSS和JavaScript文件还是很有用的。 + +#### Up/Down上下键调整CSS样式值 + +在调试CSS时，你可以选择一个属性然后使用上下箭头来调整它的值。默认情况下上下箭头会将增减值，默认情况增减值为 1，按住了alt键，每次增减的值就会变成0.1（处理一些浮点类型的数值属性时非常有用）、按住Ctrl增减为100、shift增减值为10。 + +#### 保存日志 + +保存日志是一个复选框 Console > 设置图标 > Preserve Log + +它允许在页面刷新后仍然保存日志。这在调试需要刷新页面的网站问题时非常有用，因为默认情况下，所有控制台输出的信息在页面刷新后都会被清除。 +启用此选项后，控制台中会出现一个新的“导航”日志，它指向了刷新或是导航到的页面。 + +日志过滤：Console > Filter输入框 + +当调试具有大量网络请求或控制台日志的应用程序时，过滤特定类型的事件是很有用的。 +Chrome有一种支持多种属性的过滤语言，以及类似于*的通配符。 +如果你输入了“-”，Chrome会出现一个包含了可选过滤选项的提示框，你也可以打开“正则模式”来对每一行的数据进行正则匹配。 + +#### 代码覆盖率 + +代码覆盖率可以在运行Web应用程序后针对每个JavaScript和CSS文件，查看哪些代码行运行了，哪些代码没有运行。这是很有用的，因为在处理复杂或长期项目时，很容易在项目中累积无用的代码。 + +控制台三点图标 More tools > Coverage > recordz + +如果想要使用这个功能的话，首先升级Chrome到59或更高版本，之后切换到“Coverage”页面。点击“record”，之后开始使用你的Web应用。当你使用结束后，Chrome将向你显示操作期间运行的具体代码。 + “ 资源”面板中 的代码覆盖细目 +每行代码都是彩色编码的： +绿色表示执行代码行。 +坚实的红色意味着它没有执行。 diff --git a/_posts/2017-08-10-fixedColumnTable.markdown b/_posts/2017-08-10-fixedColumnTable.markdown new file mode 100644 index 00000000..0a9b2324 --- /dev/null +++ b/_posts/2017-08-10-fixedColumnTable.markdown @@ -0,0 +1,163 @@ +--- +layout: post +title: Css实现固定列表格 +tags: Css +--- + +# 固定表格 + +index.html +```html + + + + + + + + + + + + + + + + + + + + + + + +
+ 排序 +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
名称英文名称下属国家排序状态创建人创建时间
下属国家下属国家下属国家排序状态创建人创建时间  
下属国家下属国家下属国家排序状态创建人创建时间  
+
+ + + + + + + + + + + + +
+ 操作 +
+
+
+ + +``` + +style.css + +``` css +@charset "UTF-8"; + * { + margin:0; + padding:0; + list-style:none; + font-family:'Microsoft Yahei','WenQuanYi Micro Hei Mono','WenQuanYi Micro Hei','Microsoft Yahei Mono',sans-serif,Simsun; + outline:none none none none; + -moz-box-sizing:border-box; + box-sizing:border-box; +} +::-webkit-scrollbar { + width:5px +} +::-webkit-scrollbar-track-piece { + background-color:transparent +} +::-webkit-scrollbar-thumb { + background:#ddd; + border-radius:3px +} +.table-container { + overflow-x:auto; + overflow-y:hidden; + vertical-align:top; + display:inline-block; + width:-moz-calc(100% - 8em); + width:-webkit-calc(100% - 8em); + width:calc(100% - 8em); + margin:0 -0.6em; + border-left:1px solid #cfdbe2; +} +.manipulate{ + vertical-align:top; + width:auto; + display:inline-block; +} + +table { + width:100%; + height:auto; + border-collapse:collapse; + text-align:center; +} +tr { + height:3.5em; + background-color:#fff; +} +tr:nth-child(odd) {/*even*/ + background-color:#d9edf7; +} +td,th { + border:1px solid #cfdbe2; + max-width:150px; + box-sizing:border-box; + text-align:center; + white-space:nowrap; + text-overflow:ellipsis; + overflow:hidden; + padding:0 1em; +} +``` + + + + + + diff --git a/_posts/2017-08-11-vueUseTheSentry.md b/_posts/2017-08-11-vueUseTheSentry.md new file mode 100644 index 00000000..c7a293fd --- /dev/null +++ b/_posts/2017-08-11-vueUseTheSentry.md @@ -0,0 +1,106 @@ +--- +layout: post +title: Vue2.0项目整合sentry +tags: 工具 +--- + +### 一、Sentry是什么 + +Sentry 是一个开源的实时错误报告工具，支持 web 前后端、移动应用以及游戏，支持 Python、OC、Java 等等主流编程语言和框架 ，还提供了 GitHub、Slack、Trello 等常见开发工具的集成。Sentry 是个不错的日志监控工具。 + +### 二、Sentry可以做什么 + +可以实时监控网站错误报告并发送通知，Sentry中的通知有很多种默认情况是以邮件的形式发送通知。 + + +### 三、Sentry怎么用 + +[Sentry Vue 文档][1] 此插件仅适用于Vue 2.0或更高版本。 + +Sentry官方集成了vue，但是官方文档在vue中的使用说明只有寥寥几行，仅仅说明了如何引入与集成简单的两步。 + +#### **官方使用如下：** + +**1.安装** +```js +npm install raven-js --save +``` +**2.导入并配置Raven.js和Raven.js Vue插件** + +```js +import Vue from 'vue'; +import Raven from 'raven-js'; +import RavenVue from 'raven-js/plugins/vue'; + +// Sentry 项目跟踪的key： 注册账号创建项目会得到一个key +Raven + .config('https://1c20403dff0e42cd9d3b7b5fc2af851e@sentry.io/202597') + .addPlugin(RavenVue, Vue) + .install(); + +``` +![此处输入图片的描述][2] + + +#### **Vue项目实际使用：** +```js +// 安装 +npm install raven-js --save + +// 配置：在helper目录下新建error-reporting.js +import Vue from 'vue' +import Raven from 'raven-js' +import RavenVue from 'raven-js/plugins/vue' + +const PROCESS_ENV = process.env.NODE_ENV +const isProduction = PROCESS_ENV === 'production' +const ignoreUrls = ['127.0.0.1', 'localhost'] + +// 2 prod 3 dev +let sentryUrl = isProduction ? 'https://1c20403dff0e42cd9d3b7b5fc2af851e@sentry.io/202597' : 'https://1c20403dff0e42cd9d3b7b5fc2af851e@sentry.io/202597' + +export default { + init () { + Raven + .config(sentryUrl, { + release: process.env.RELEASE_VERSION, + environment: PROCESS_ENV, + ignoreUrls: ignoreUrls + }) + .addPlugin(RavenVue, Vue) + .install() + }, + captureException (...args) { + if (isProduction) { + return Raven.captureException(...args) + } + } +} + +// 同级index.js引用 +export const $errReport = require('./error-reporting.js').default + +// 在main.js 引用 +import { $errReport } from 'helper' + +// 初始化sentry错误报告 +$errReport.init() + +// 在ajax.js收集错误信息 +import { $errReport } from 'helper' +$errReport.captureException(error) +``` + + +### 四、为什么要用Sentry +我不知道...... + + + + + + + + [1]: https://docs.sentry.io/clients/javascript/integrations/vue/ + [2]: http://ouiqhbcw9.bkt.clouddn.com/_dji_screenshot_1502450515262.png + [3]: http://ouiqhbcw9.bkt.clouddn.com/_dji_screenshot_1502456662142.png diff --git a/_posts/2020-01-01-aboutme.markdown b/_posts/2020-01-01-aboutme.markdown new file mode 100644 index 00000000..5d86382a --- /dev/null +++ b/_posts/2020-01-01-aboutme.markdown @@ -0,0 +1,6 @@ +--- +layout: post +title: 关于我 +tags: About +--- +今天起的比昨天早。 diff --git a/_sass/a-smallscreen.sass b/_sass/a-smallscreen.sass index 65206ca1..92c73611 100644 --- a/_sass/a-smallscreen.sass +++ b/_sass/a-smallscreen.sass @@ -6,7 +6,8 @@ transform: translateX(100%) #main - width: 100% + width: 98%; + margin: auto #menu display: block .container diff --git a/assets/.DS_Store b/assets/.DS_Store new file mode 100644 index 00000000..0d548508 Binary files /dev/null and b/assets/.DS_Store differ diff --git a/assets/img/avatar.jpg b/assets/img/avatar.jpg index 17b0034d..efa6a9f4 100644 Binary files a/assets/img/avatar.jpg and b/assets/img/avatar.jpg differ