方法一,提示蒙层提醒用户保持竖屏体验,这种方法体验太差 方法二,强制横屏显示,对屏幕 resize 事件进行监听,当判断为竖屏时将整个根容器进行逆时针 CSS3 旋转 90 度即可,代码如下所示。 这种方法可以解决绝大多数问题了。 // 利用 CSS3 旋转 对根容器逆时针旋转 90 度 var detectOrient = function() {   var width = document.documentElement.clientWidth,       height =  document.documentElement.clientHeight,    
野猪佩奇 2018-05-03 JavaScript 1059
效果: 算法: 代码: div class="stage" div class="sence" div class="sprite" /div /div /div style .stage{width: 100%; overflow: hidden; position: relative; } .sence{width: 1024px; height: 350px; background:url(../assets/images/background.jpg); position: relative;} .s
野猪佩奇 2018-04-27 JavaScript 1000
类似《返校》和《无尽梦魇》的那种。 基本算法: 主要是解决精灵匀速直线运动的问题。 效果: 代码: div class="stage" div class="sence" div class="sprite" /div /div /div style .stage{width: 100%; overflow: hidden; position: relative; } .sence{width: 1024px; height: 350px; background:url(../assets/i
野猪佩奇 2018-04-26 JavaScript 919
body style="overflow:hidden" div class="stage" div class="content" img src="images/timg.jpeg" alt="" /div div class="roles" div class="roleOne" img src="images/mengpo.png" alt="" /div
野猪佩奇 2018-04-26 JavaScript 1178
问题描述: 父组件传如lesser和larger两个参数,并且是ajax从服务器获取的。子组件定义created阶段输出lesser和larger。但larger为空。改成延迟输出则正确。 问题来源:https://segmentfault.com/q/1010000008912491 提问者的主要问题是没有搞清楚,vue实例的生命周期,created函数只会执行一次。 父组件: template my-editor :lesser="lesser" :larger="larger" /my-editor /template script
野猪佩奇 2018-04-23 JavaScript 2266
event.clientX、event.clientY 鼠标相对于浏览器窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条。IE事件和标准事件都定义了这2个属性 event.pageX、event.pageY 类似于event.clientX、event.clientY,但它们使用的是文档坐标而非窗口坐标。这2个属性不是标准属性,但得到了广泛支持。IE事件中没有这2个属性。 event.offsetX、event.offsetY 鼠标相对于事件源元素(srcElement)的X,Y坐标,只有IE事件有这2个属性,标准事件没有对应的属性。 event.sc
野猪佩奇 2018-04-17 JavaScript 862
PM2 简介 pm2 是一个带有负载均衡功能的Node应用的进程管理器。 当你要把你的独立代码利用全部的服务器上的所有CPU,并保证进程永远都活着,0秒的重载, PM2是完美的。 命令详解: 安装 npm install -g pm2 用法 $ npm install pm2 -g # 命令行安装 pm2 $ pm2 start app.js -i 4 #后台运行pm2,启动4个app.js # 也可以把'max' 参数传递给 start # 正确的进程数目依赖于Cpu的核心数目 $ pm2 start app.js --name my-api # 命名进程 $
野猪佩奇 2018-04-06 WordPress MySQL Node.js 2591
在一个网页中,如果有一个弹出的层是可以上下滚动的。 但是弹出层滚动到底部时,底层也会跟着滚动。 这其实是手机浏览器一个非常“顽固”的也似乎难以解决默认事件。 我之前也遇到过,最初也是各种阻止默认事件啊,PC有用,但是移动端一点用也没有。 后来是加了 html,body{ height:100%, overflow:hidden } 但是这样做会导致内容返回顶部。 后来研究了下天猫,他们也没有很好的解决,有的地方底部仍然可以滑动。 研究过苏宁易购,他们做的比较有意思,先记录下当前的位置,虽然底部内容也是可以滑动的,当弹出层关闭后,再返回那个位置。当然他们的
野猪佩奇 2018-03-27 CSS 1224
mt-cell is-link title="测试" v-on:click.native="test" img slot="icon" src="../../assets/images/icon/credit-card.svg" width="24" height="24" /mt-cell 这样才能正常绑定事件test,去掉is-link也可以绑定,如下: mt-cell title="测试" v-on:click.native="test" img slot="icon" src="../../assets/images/icon/credi
野猪佩奇 2018-03-13 JavaScript 3220
工作进程:var http = require('http'); var port = Math.round((1 + Math.random()) * 1000); http.createServer(function (req, res) { res.writeHead(200, { 'Content-Type': 'text/plain' }); res.end('Hello World\n'); }).listen(port, '127.0.0.1'); console.log("port: ", port); 主进程:var { fork } = require('chi
野猪佩奇 2018-02-28 Node.js 916
在做一个手机页面的时候,需要下拉滑动,结果浏览器总是自动刷新,百度了一下,禁止浏览器下拉刷新的方法如下: body style="overflow:hidden" 注意: 必须写这样的属性,放在css文件中的,好像没用!
野猪佩奇 2018-02-05 CSS 1776
1.node.js 的express服务器报 413 payload too largeexpress 4.0后版本var bodyParser = require('body-parser');app.use(bodyParser.json({limit: '50mb'}));app.use(bodyParser.urlencoded({limit: '50mb', extended: true}));https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Status/4132. 按说axios里会
野猪佩奇 2018-01-03 JavaScript 1164
FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File 或 Blob 对象指定要读取的文件或数据。其中File对象可以是来自用户在一个 input 元素上选择文件后返回的FileList对象,也可以来自拖放操作生成的 DataTransfer对象,还可以是来自在一个HTMLCanvasElement上执行mozGetAsFile()方法后返回结果.对于图像类型的文件,Blob对象的type属性都是以"Image/"开头的,利用这个特性可以判断用户选择的文件是否是图像类型的。FileReader接口:主要用来把文
野猪佩奇 2018-01-02 JavaScript 1001
在浏览器中,我们一旦把节点添加到document.body(或者其他节点)中,页面就会更新并反映出这个变化,对于少量的更新,一条条循环插入也会运行很好,也是我们常用的方法。但是,如果当我们要向document中添加大量数据时(比如1w条),如果像上面的代码一样,逐条添加节点,这个过程就可能会十分缓慢。 documentFragment 被所有主流浏览器支持。所以,没有理由不用。DocumentFragments 是DOM节点。它们不是主DOM树的一部分。通常的用例是创建文档片段,将元素附加到文档片段,然后将文档片段附加到DOM树。在DOM树中,文档片段被其所有的子元素所代替。因为文
野猪佩奇 2017-12-29 JavaScript 981
以下内容已整合到脚手架:sorrycc/dva-boilerplate-electron近期,我们在内部做了一个类似 IDE 性质的应用,基于 electron。过程中趟过不少坑,也有了些心得,记录如下。包含:数据通讯架构方案Two-Package 目录结构源码打包应用打包数据通讯数据通讯方案决定整体的架构方案。翻翻 Electron 文档,应该不难发现,Electron 有两个进程,分别为 main 和 renderer,而两者之间是通过 ipc 进行通讯。main 端有 ipcMain,renderer 端有 ipcRenderer,分别用于通讯。一个简单的读取文件的例子:main 端
野猪佩奇 2017-12-26 JavaScript 944
本人的项目是 vue + webpack,vue单文件中使用了 Jade 模板与 less 预编译器 起因是因为谈论到 Jade 模板问题,Jade 早已改名为 Pug,并且发布了2.0版本,想着不如升级了吧,顺便把 webpack 与 vue 也一并升级了,事实证明,升级需谨慎 = = 首先之前的版本如下: "vue": "2.4.2" "webpack": "2.7.0" 升级后的版本为: "vue": "2.5.7" &
野猪佩奇 2017-12-20 JavaScript 984
模块检查更新 生成工程后,一段时间很多模块都有更新,如何把工程中的模块都更新到最新的呢。 npm update一次只能更新一个包 首先我们先通过命令查看下需要更新的版本: npm outdated npm outdated 会列出所有可更新的 node_modules,如下: Package Current Wanted Latest Location autoprefixer 6.7.2 6.7.2 7.1.2 vue-test ba
野猪佩奇 2017-12-19 Node.js 1044
前段时间升级了Node.js,现在执行`npm install`的时候,就会在当前目录生成一个`package-lock.json`的文件。 package.json里面定义的是版本范围(比如^1.0.0),具体跑npm install的时候安的什么版本,要解析后才能决定,这里面定义的依赖关系树,可以称之为逻辑树(logical tree)。node_modules文件夹下才是npm实际安装的确定版本的东西,这里面的文件夹结构我们可以称之为物理树(physical tree)。安装过程中有一些去重算法,所以你会发现逻辑树结构和物理树结构不完全一样。 packag
野猪佩奇 2017-12-19 Node.js 950
Having the same issue on npm 5.4.2. Initially I tried npm cache clear --force but it did not resolve my issue. Removing package-lock.json didn't either. Removing both node_modules and package-lock.json worked: rm -rf node_modules/ rm package-lock.json # Install and add the package
野猪佩奇 2017-12-19 Node.js 1435
看字面意思大概是package.json里缺少repository字段,也就是说缺少项目的仓库字段 { ... "repository": { "type": "git", "url": "http://baidu.com" }, ... } 但作为测试项目或者练习用,只需在package.json里面做如下配置即可: { ... "private"
野猪佩奇 2017-12-19 Node.js 1879
随机推荐
Node.js 简介
WordPress 使用 shortcode() 增加编辑器功能
JavaScript getter和setter
Node.js process 模块
WordPress 评论表单函数 comment_form()
Node.js 使用 Jest 做单元测试
JavaScript 使用剪切板
CSS 图片缩小出现锯齿