ios端的网页上传图片后图片翻转90度的问题

iPhone在移动端网页上传照片,可能会出现图片翻转的问题。这是因为当时拍照的时候,可能是拿反的姿势。所以,在上传之前就要做下处理。
这里要需要到一个东西叫exif orientation,取到这个信息就知道当时是怎么拍的。

然后用canvas去重绘这张图,获取重绘后的新图的base64值。这才是转过的图片。
canvas drawImage方法getdataUrl方法获取base64值初始化一个canvas 然后用drawImage方法把图画到canvas上然后用rotate方法旋转、然后用toDataURL方法就能取得base64值了。

ios webview alert弹窗不显示网址解决办法

移动端alert弹窗都会显示出页面的网址,很丑,以前的版本,ios和android都可以通过重写webview的alert等弹窗事件来隐藏掉弹窗的标题,但是ios7之后,api被禁用了,导致ios无法重写来实现隐藏标题,后来想过几种方案:

  1. 通过js调用ios原生代码来实现,即:window.alert = function(str){window.local.href=”xx://str/”+str}

  2. js+html+css 模拟,但是为了实现alert等的阻塞执行,需要把后面的代码放入回调函数中执行

但是还是感觉这两种方式实现不太优雅,都需要对现有代码做比较大的改动,不死心,于是继续google,终于发现个好办法:

1
2
3
4
5
6
7
8
9
window.alert = function(name){
var iframe = document.createElement("IFRAME");
iframe.style.display="none";
iframe.setAttribute("src", 'data:text/plain,');
document.documentElement.appendChild(iframe);
window.frames[0].window.alert(name);
iframe.parentNode.removeChild(iframe);
}
alert('xxx');

这个方法在于重写了alert方法(confirm方法同理),不需要改动现有代码,并且解决了弹窗标题出现网址的问题。不过需要注意的是,每次在框架中执行完一个alert/confirm后,需要将框架移除,下次再重新载入,否则在chrome中会引发跨域执行,从而被chrome拦截。

原文出处:http://ifindever.com/archives/260.html

JQ各种尺寸笔记

1
2
3
4
5
6
7
8
9
$().width();                // width
$().innerWidth(); // width+padding
$().outerWidth(); // width+padding+border
$().outerWidth(true); // width+padding+border+margin

$().width(200); //设置宽度200
$().innerWidth(200); //设置width+padding=200
$().outerWidth(200); //设置width+padding+border=200
$().innerWidth(200, true); //设置width+padding+border+margin=200

zepto添加模块

zepto是个好东西,遵循JQ api,但比JQ小巧很多,适合移动端web开发。
但他默认支持的模块只有 zepto event ajax form ie,但想touch模块,默认是不支持的,而移动端web又需要用到手势事件,所以我们可以给zepto添加我们需要的模块。

双击事件

很多JS库都提供了双击事件,但是如果不想用第三方库呢?其实也可以自己写,代码如下:

1
2
3
4
5
6
7
8
9
10
11
var i = 0;
$(document).on('click',function (){
i++;
setTimeout(function (){
i = 0;
},500);
if( i > 1 ){
alert('双击');
i = 0;
}
});

移动端点击输入框被键盘遮挡的问题

做移动端wap页面的童鞋或多或少都会遇到移动端点击输入框被键盘遮挡的问题一般在安卓遇到的情况比较常见。
一开始也想不出解决方案,于是各种百度、谷歌,找到了一种方法:

监控输入框的焦点事件,当输入框焦点时把整个页面向上拉,拉到可视区的一半就可以了。失去焦点时在拉回来。

开启PHP环境

说到PHP环境,大多数人会想到wampserver诸如此类的东西.今天要说的是在无论在哪个目录下都可以开启php环境,不用放到像wampserver的www目录底下。
例如:我现在有一个静态页项目,而里面需要测试接口,所以新建了个test.php之类的东西,但是如果为了测试一个接口就把整个目录迁移到www目录底下,会感觉比较麻烦,那么我们可以就在整个目录下开启php环境。具体怎么做呢?