闲情zhi

生活 创业 时评 杂文

wordpress代码高亮插件 – WordPress笔记

在使用wordpress的过程中,不免会插入自己的分享的代码,但是原生的wordpress对于代码高亮的支持并不好。

这边分享一款wordpress高亮插件,也是我这个博客现阶段使用的插件WP-Syntax

1. 安装WP-Syntax

进入wp后台使用插件安装
微信截图_20151022093742

 

2. 使用WP-Syntax

这个插件的使用很简单

 

<pre lang="html" line="1" escaped="true" >
//这里添加代码……
</pre>

其中,lang=”html”表示代码语言为html,请根据自己需要修改; line=”1″ 表示显示行号,如果不需要,去掉即可;escaped=”true” 是为了防止代码转义,如果不需要,去掉即可。

PHP与Python结巴分词(jieba)结合使用的案例

结巴分词是一个很优秀的分词插件。之前写那个python爬虫网站(点击链接查看源码)的时候就用过这个分词。

在这个http://www.zunar.com.cn 的开发过程中,第一版的搜索使用php的pscws4做的,但是这个分词插件的缺陷很明显,分词不够精确。

所以自然而然的就想把结巴分词也用到网站中。所以就涉及到了PHP跟python script的结合问题。

结合很简单。写一个python的分词脚本(引入了jieba),然后使用php的exec来进行调用。

需要注意的有这么几个点:

  1. php.ini中disable_functions 中需要允许exec(或jieba者其他)函数的调用
  2. linux环境中,python脚本需要添加可执行权限 chmod +x jieba.py
  3. 在编写过程中碰到的一个很大的问题就是中文参数乱码的问题,我所有的文件字符编码都是utf8,但使用php调用的时候会发生非常神奇的bug,详情参看我在stackoverflow上面的提问 ,解决方案我也在回答中说明了,至今不明白为什么三个中文字符就会出现乱码。有兴趣的可以来调试一下。

 

jieba.py代码


#coding:utf-8
import jieba
import sys
from urllib import unquote

keywords = " ".join(sys.argv[1:])
seg_list = jieba.cut(unquote(keywords), cut_all=True)

#fp = open("./test.txt",'a') 
new_str = ""
for t in seg_list:
	str1 = t
	if isinstance(t, unicode):
		str1 = t.encode("utf-8")

	new_str = new_str + str1 + " "
	#fp.write(str1) 
#fp.close()
print new_str

调试代码.zip

plupload文件上传插件点击上传按钮无响应的解决方案

之前开发用了swfupload,不过用了plupload之后,感觉后者的兼容性更加的好。不过在开发过程中遇到了一个如题的一个问题。点击上传按钮无法响应。

微信截图_20151016175533

 

在开发的时候chrome,以及本地的ie8+浏览器都验证通过。但一直有房东不定期的吐槽,点击添加图片没有反应,通常都是遨游浏览器。

下载遨游(切换成各种ie内核都不行)一调试,我操!真的是无法上传。

 

然而下载官方的demo,使用遨游浏览器却可以。

 

webwxgetmsgimg

 

一定是哪里撸伤了!

 

后来在无意中的调试发现了一个规律。

因为我这个上传的父div默认是display none,用户切换到图片上传菜单的时候 才会变成block,但plupload是在页面加载的时候就初始化的。如果刚开始图片上传的div是block的话,就能够正常的响应。

这一定是一个bug!

解决方案很简单,当图片上传div变成block的时候,执行一下  uploader.refresh()  就可以修复这个bug了!

 

侯赛来!

微博粉丝服务平台PHP-SDK

因为公司产品有需要,所有把官方的粉丝平台API做了一个简单封装。当然还没有完全,只是封装了我需要用到的一些功能。地址:微博粉丝平台PHP-SDK 持续更新中…



namespace Org;

class Weibo {

const MENU_CREATE_URL = "https://m.api.weibo.com/2/messages/menu/create.json";

//自定义回复相关地址
const RECEIVE_MSG_URL = "https://m.api.weibo.com/2/messages/receive.json"; //需要长连接,详见文档:http://open.weibo.com/wiki/2/messages/receive
const REPLY_MSG_URL = "https://m.api.weibo.com/2/messages/reply.json"; //消息回复接口,详见文档:http://open.weibo.com/wiki/2/messages/reply
const MSGTYPE_TEXT = "text";
const MSGTYPE_POSITION = "position";
const MSGTYPE_IMAGE = "image";
const MSGTYPE_VOICE = "voice";
const MSGTYPE_EVENT = "event";
const MSGTYPE_MENTION = "mention";
const EVENT_SUBSCRIBE = "subscribe";
const EVENT_UNSUBSCRIBE = "unsubscribe";
const EVENT_FOLLOW = "follow";
const EVENT_UNFOLLOW = "unfollow";

//订阅发送相关地址

//私信提醒相关地址

//好友邀请相关地址

//获取用户信息
const USER_INFO_URL = "https://api.weibo.com/2/eps/user/info.json";

//私有变量
private $appkey; //指定用于开发模式的应用appkey,详见:http://t.cn/zRp0sr6
private $appsecret;
private $token;
private $message; //要回复的消息内容
private $messageType; //要回复的消息类型
private $_receive;

public function __construct($options) {
$this->appkey = isset($options['appkey'])?$options['appkey']:'';
$this->appsecret = isset($options['appsecret'])?$options['appsecret']:'';
$this->token = isset($options['token'])?$options['token']:'';
}
/**
* 微博粉丝服务平台验证
*/
private function checkSignature() {
$signature = $_GET["signature"];
$timestamp = $_GET["timestamp"];
$nonce = $_GET["nonce"];

$appsecret = $this->appsecret; //开发者的appsecret
$tmpArr = array($appsecret, $timestamp, $nonce);
sort($tmpArr, SORT_STRING);
$tmpStr = implode( $tmpArr );
$tmpStr = sha1( $tmpStr );

if( $tmpStr == $signature ){
return true;
}else{
return false;
}
}

/**
* 回复文字消息
*/
public function text($text = "") {
$this->message = array("text" => urlencode($text));
$this->messageType = "text";
return $this;
}

/**
* 回复图文消息
* @param $article 图文消息内容
* array(
* array(
* "title" => "消息的标题",
* "content" => "消息的内容",
* "image" => "消息的图片",
* "url" => "消息链接"
* )
* )
*
*
* //多图文方式回复,多个图文时在“articles”中添加多个数组既可,最多支持8个
* $type = "articles";
* $replayText = json_encode(
*
* array (
* 'display_name'=>'图文标题1',
* 'summary'=>'图文摘要​1',
* 'image'=>'http://storage.mcp.weibo.cn/0JlIv.jpg',
* 'url'=>'http://open.weibo.com/wiki/Messages'
* ),
* array (
* 'display_name'=>'图文标题2',
* 'summary'=>'图文摘要​2',
* 'image'=>'http://ww2.sinaimg.cn/small/71666d49tw1dxms4qp4q0j.jpg',
* 'url'=>'http://open.weibo.com/wiki/Messages'
* ),
* array (
* 'display_name'=>'图文标题3',
* 'summary'=>'图文摘要​3',
* 'image'=>'http://http://ww2.sinaimg.cn/small/71666d49tw1dxms5mm654j.jpg',
* 'url'=>'http://open.weibo.com/wiki/Messages'
* )
* );
*/
public function article($article = "") {
$this->message = array("articles" => $articles);

$this->messageType = "articles";
return $this;
}

public function reply() {
$msg = array(
"result" => true,
"sender_id" => $this->_receive['receiver_id'],
"receiver_id" => $this->_receive['sender_id'],
"type" => $this->messageType,
//data字段需要进行urlencode编码
"data" => json_encode($this->message)
);

echo json_encode($msg);
}

/**
* 验证服务器端
*/
public function valid() {
if (isset($_GET["echostr"])) {
die($_GET["echostr"]);
}
return true;
}

/**
* 获取用户发送的信息
*/
public function getRev() {
if ($this->_receive) return $this;
$this->_receive = json_decode($GLOBALS['HTTP_RAW_POST_DATA'], true);
return $this;
}

/**
* 获取消息发送者的ID,即蓝v粉丝
*/
public function getRevFrom() {
return $this->_receive['receiver_id'];
}

/**
* 获取消息接受者的ID,即蓝v自己
*/
public function getRevTo() {
return $this->_receive['sender_id'];
}

/**
* 获取消息类型
*/
public function getRevType() {
return $this->_receive['type'];
}

/**
* 获取消息内容
*/
public function getRevContent() {
return $this->_receive['text'];
}

/**
* 获取消息data
*/
public function getRevData() {
return $this->_receive['data'];
}

/**
* 获取产生事件的用户信息
*
* @param [type] $uid [description]
* @return [type] [description]
*/
public function getUserInfo($uid = "2541756412") {
$result = $this->httpGet(self::USER_INFO_URL . "?access_token=" . $this->token . "&uid=" . $uid);
return json_decode($result, true);
}

/**
* 获取用户uid
*/
public function getUserUid() {

}

/**
* 创建自定义菜单
*
* {
*"button": [
* {
* "type": "click",
* "name": "获取优惠券",
* "key": "get_groupon"
* },
* {
* "type": "click",
* "name": "查询客服电话",
* "key": "the_big_brother_need_your_phone"
* },
* {
* "name": "菜单",
* "sub_button": [
* {
* "type": "view",
* "name": "网上4S店",
* "url": "http://apps.weibo.com/1838358847/8rYu1uHD"
* },
* {
* "type": "view",
* "name": "砍价团",
* "url": "http://apps.weibo.com/1838358847/8s1i6v74"
* },
* {
* "type": "click",
* "name": "么么哒",
* "key": "memeda"
* }
* ]
* }
*]
*}
*/
public function createMenu($data) {
$result = $this->httpPost(array(
"access_token" => $this->token,
"menus" => json_encode($data)
), self::MENU_CREATE_URL);

$parse = json_decode($result, true);
if ($parse['result']) {
return array(
"code" => 200,
"message" => "菜单创建成功"
);
} else {
return array(
"code" => 400,
"message" => $parse
);
}
}

/**
* POST请求
*/
public function httpPost($param, $url, $timeout = 30) {

$ch = curl_init();

if(stripos($url,"https://")!==FALSE){
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
curl_setopt($ch, CURLOPT_SSLVERSION, 1); //CURL_SSLVERSION_TLSv1
}

if (is_string($param)) {
$strPOST = $param;
} else {
$aPOST = array();
foreach($param as $key=>$val){
$aPOST[] = $key."=".urlencode($val);
}
$strPOST = join("&", $aPOST);
}

curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
#curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_BASIC);
#curl_setopt($ch, CURLOPT_USERPWD, $user . ':' . $passwd);
curl_setopt($ch, CURLOPT_TIMEOUT, $timeout);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $strPOST);
$data = curl_exec($ch);
curl_close($ch);
return $data;
}

/**
* get请求
*/
private function httpGet($url) {
$oCurl = curl_init();
if(stripos($url,"https://")!==FALSE){
curl_setopt($oCurl, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt($oCurl, CURLOPT_SSL_VERIFYHOST, FALSE);
curl_setopt($oCurl, CURLOPT_SSLVERSION, 1); //CURL_SSLVERSION_TLSv1
}
curl_setopt($oCurl, CURLOPT_URL, $url);
curl_setopt($oCurl, CURLOPT_RETURNTRANSFER, 1 );
$sContent = curl_exec($oCurl);
curl_close($oCurl);

return $sContent;
}
}

 

 

Sublime Text添加包管理——Sublime Text使用笔记(二)

Sublime Text本身最强大的就是他的各种第三方的插件,第三方插件的管理就应运而生。

 

1. 安装Package Control

通过快捷键Ctrl + ` (小数字1左边那个),在出现的输入栏中粘贴对应的代码

Sublime Text3:

import  urllib.request,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();urllib.request.install_opener(urllib.request.build_opener(urllib.request.ProxyHandler()));open(os.path.join(ipp,pf),'wb').write(urllib.request.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read())

Sublime Text2:

import  urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp)ifnotos.path.exists(ipp)elseNone;urllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler()));open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read());print('Please restart Sublime Text to finish installation')

BaiduShurufa_2015-9-4_10-31-41

2. 使用Package Control管理插件

按Ctrl + Shift + P即可使用Package Control的相关功能(增加、删除)

BaiduShurufa_2015-9-4_10-34-42

Centos6.4添加Adobe Flash支持——打造强大的linux环境(二)

刚用centos的用户经常会碰到一个问题,就是Firefox(火狐浏览器)不支持Adobe Flash,需要自行安装Flash插件

1. 添加Adboe Flash软件源

Centos 64位用户

rpm -ivh http://linuxdownload.adobe.com/adobe-release/adobe-release-x86_64-1.0-1.noarch.rpm
rpm –import /etc/pki/rpm-gpg/RPM-GPG-KEY-adobe-linux

Centos 32位用户

rpm -ivh http://linuxdownload.adobe.com/adobe-release/adobe-release-i386-1.0-1.noarch.rpm
rpm –import /etc/pki/rpm-gpg/RPM-GPG-KEY-adobe-linux

 

2. 更新软件源

yum check-update

3. 安装Adobe Flash

yum install flash-plugin nspluginwrapper alsa-plugins-pulseaudio libcurl

4. 重启Firefox

grep命令——Linux指令场景练习(二)

grep(Global Regular Expression Print)是一个非常常用的linux指令,用于文本搜索。我在很多地方都见到过这个指令,在写一键安装包的时候需要获取主机IP,grep这个指令就属于必须需要接触的。

语法

grep [options]  pattern [file]  # grep [可选参数] 表达式 文件

场景一:获取Linux主机本地IP

ifconfig | grep "inet addr" | grep -v "127.0.0.1" | cut -d: -f2 | awk '{print $1}'

ifconfig(network interfaces configuring): 显示本机的网络设备信息

grep “inet addr” :过滤包含 inet addr 的字段并显示,第三个参数是ifconfig传过来的

[root@default ~]# ifconfig | grep "inet addr"
 inet addr:127.0.0.1 Mask:255.0.0.0
 inet addr:127.0.0.1 P-t-P:127.0.0.1 Bcast:0.0.0.0 Mask:255.255.255.255
 inet addr:45.62.96.30 P-t-P:45.62.96.30 Bcast:45.62.96.30 Mask:255.255.255.255

grep -v “127.0.0.1”:inet addr的字段会有很多个,去除包含指向本地的字段

[root@default ~]# ifconfig | grep "inet addr" | grep -v "127.0.0.1"
 inet addr:45.62.96.30 P-t-P:45.62.96.30 Bcast:45.62.96.30 Mask:255.255.255.255

cut -d: -f2:  -d:表示以:切割字符串,-f2表示取得第二组数据

45.62.96.30  P-t-P

awk ‘{print $1}’:代表以空格分隔字符串,并打印第一组数据

45.62.96.30

 

解决WIN7不能登录L2TP/IPSEC VPN的方法

之前搭好了L2TP/IPSEC的VPN,手机端登陆很顺畅,不过每次使用WIN7登陆的时候,一直报809错误。

然后手机端登陆的时候就会显示超时。

超时的原因是服务器端的IPSEC或XL2TPD服务停止了….(因为WIN7那边登陆不成功)

 

我成功的方案是这样的

1. 打开注册表

win+R
输入regedit

找到

HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\PolicyAgent

添加字段

AssumeUDPEncapsulationContextOnSendRule=dword:00000002

BaiduShurufa_2015-2-28_9-56-50

 

2. 删除字段

HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\services\RasMan\Parameters
删除 ProhibitIpSec 字段

3. 重启计算机,然后就可以了!

sed命令——Linux指令场景练习(一)

因为最近在搭建L2TP/Ipsec VPN之前写了一个自己安装时候的顺序教程,所以也打算写一个L2TP/IPSEC一键安装包。

学习过程中需要用到shell来编写脚本,也是一个学习的过程,所以这边就把各种应用到的linux命令集合起来。这边的不是教程,而是根据功能场景来进行记录。

sed命令的应用格式如下

sed 可选参数 表达式/正则等 文件名(包含路径)
sed -i 's/old/new/ /etc/xxx.conf

 

场景一: 根据关键词定位到某行,整行替换。

脚本编写的时候需要修改文件中的某行,比如

 ;listen-addr = 192.168.1.1

需要修改成

listen-addr  = 10.1.1.1

 

所以sed命令定位关键词行,然后进行整行替换。

sed -i '/listen-addr[[:space:]]*=/c\listen-addr = 10.1.1.1' /etc/xl2tpd/xl2tpd.conf

-i 代表修改的内容直接写入源文件

c\ 代表用后面的内容替换行

[[:space:]] 代表空格/Tab

持续更新中…

Centos6.5搭建l2tp/Ipsec VPN —— VPN系列(一)

之前合伙在Linode上买了VPS,除了可以放站点之外,作为一个VPN来使用也是在计划之中。

我使用的centos内核是3.X,折腾了好久一直不成功。后来切换到2.X版本终于成功,记录在这里,方便他人。

 

准备

1. 国外VPS,本文以Linode VPS为例。

centos6.5(with kernel 2.6.32)

QQ图片20150224165231

 

因为LinodeVPS是我们几个人共用的,所以不敢随便乱练手,所以在我的bandwagonhost上练手,版本如下。

QQ截图20150225211104

 

2. 添加xl2tpd的源,下载xl2tpd,ppp

rpm -Uvh http://dl.fedoraproject.org/pub/epel/6/i386/epel-release-6-8.noarch.rpm
yum install xl2tpd ppp openswan

 

安装

1. 查看本机的kernel是否为2.X

QQ截图20150225211104

如果是的话则继续。

执行 yum update 更新软件包

2. 安装xl2tpd源

rpm -Uvh http://dl.fedoraproject.org/pub/epel/6/i386/epel-release-6-8.noarch.rpm

 

3. 安装openswan,ppp,xl2tpd

yum install openswan ppp xl2tpd

 

以上三步作为最基本的准备工作。

 

配置

修改/etc/xl2tpd/xl2tpd.conf

[global]
listen-addr = 45.62.96.30   #改成自己本机的IP
ipsec saref = yes
[lns default]
ip range = 192.168.1.128-192.168.1.254    #分配的客户端IP
local ip = 192.168.1.1                 #本地IP  不用改
refuse chap = yes                     #改成refuse
refuse pap = yes
require authentication = yes
name = l2tp
ppp debug = yes
pppoptfile = /etc/ppp/options.xl2tpd
length bit = yes

 

修改/etc/ppp/options.xl2tpd

ipcp-accept-local
ipcp-accept-remote
ms-dns 8.8.8.8
ms-dns 8.8.4.4
noccp
auth
crtscts
debug
hide-password
modem
lock
proxyarp

 

修改/etc/ipsec.conf 在末尾添加

conn L2TP-PSK-NAT
 rightsubnet=vhost:%priv
 also=L2TP-PSK-noNAT
conn L2TP-PSK-noNAT
 authby=secret
 pfs=no
 auto=add
 keyingtries=3
 rekey=no
 ikelifetime=8h
 keylife=1h
 type=transport
 left=45.62.96.30  #这边替换成你的本机IP
 leftprotoport=17/1701
 right=%any
 rightprotoport=17/%any

 

添加/etc/ipsec.secrets 预定义密钥

vi /etc/ipsec.secrets
45.62.96.30     %any: PSK       "test1234"    #ip地址替换成你的本机ip

 

设置网络策略(这个我也不懂)

直接在终端输入

for each in /proc/sys/net/ipv4/conf/*
do
      echo 0 > $each/accept_redirects
      echo 0 > $each/send_redirects
done

 

创建账户文件

vi /etc/ppp/chap-secrets

里面格式为(如我的)

#用户名 * 密码 *

lizhug * 1234567890 *

 

修改系统配置文件/etc/sysctl.conf  在结尾添加

net.ipv4.ip_forward = 1
net.ipv4.conf.default.rp_filter = 0
net.ipv4.conf.all.send_redirects = 0
net.ipv4.conf.default.send_redirects = 0
net.ipv4.conf.all.log_martians = 0
net.ipv4.conf.default.log_martians = 0
net.ipv4.conf.default.accept_source_route = 0
net.ipv4.conf.all.accept_redirects = 0
net.ipv4.conf.default.accept_redirects = 0
net.ipv4.icmp_ignore_bogus_error_responses = 1

执行 sysctl -p 是上面的设置生效

修改防火墙设置,直接在终端执行
iptables -t nat -A POSTROUTING -o eth0 -j MASQUERADE
service iptables save
service iptables restart

测试执行

ipsec setup start

ipsec verify

出现如下提示就OK,如果出现了FAILED,直接粘贴google找修改方法

[root@default ~]# ipsec verify 
Checking your system to see if IPsec got installed and started correctly:
Version check and ipsec on-path [OK]
Linux Openswan U2.6.32/K(no kernel code presently loaded)
Checking for IPsec support in kernel [OK]
 SAref kernel support [N/A]
Checking that pluto is running [OK]
 Pluto listening for IKE on udp 500 [OK]
 Pluto listening for NAT-T on udp 4500 [OK]
Checking for 'ip' command [OK]
Checking /bin/sh is not /bin/dash [OK]
Checking for 'iptables' command [OK]
Opportunistic Encryption Support [DISABLED]

 

常见问题

1. Checking for IPsec support in kernel                            [FAILED]

需要解决这个问题首先查看一下

ipsec whack --status

有些内核是不支持ipsec的,如bandwagonhost的VPS ORZ……

如果你的内核支持ipsec那基本上就没问题了。

bandwagonhost低价VPS试用

之前在Linode上跟同学一起买了Tykyo节点的服务器,速度杠杠的,可以在100ms左右。

不过这个服务器作为公用服务器,不能肆意的重启,重装等等。

所以为了练手,特意买了$3.99/year 的bandwagonhost。

刚开始试用下来感觉还不错。

 

比如我写L2TP/ipsec的时候就是利用这台服务器一直试错,然后重装等。

美国西海岸速度大概在300ms+左右。

 

他的KiwiVM面板操作起来挺容易的,不过这种服务器就不适合建站啦,这个价格内存肯定不会很高的。

QQ截图20150225212205

 

 

IE兼容background-size —— IE系列黑魔法(二)

简单介绍

非ie浏览器是支持background-size这个css属性的,所以在就算sprite或者普通图片的大小跟实际大小不同也可以通过background-size这个属性来进行缩放。

 

但是在ie8下面,这个background-size不生效,在网站中就会发生这种现象。

效果图片

QQ截图20150201230518

正常效果

QQ截图20150201230533

ie8下效果

QQ截图20150201230604

ie8+效果(正常)

 

解决方案

针对这个现象IE下可以使用


.site-qr-introduce .icon-type-select {
background-size: 118px; //IE下不生效
background-position: 0 0;
background-repeat: no-repeat;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/static/img/home/icon1.png',sizingMethod='scale');
}

即IE下的属性filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(“src=’你的图片地址'”,sizingMethod=’scale’)

在这个时候,background-size的自动变成了background-size:cover (父元素的width)

比如:

.site-qr-introduce .icon-image {
width: 125px;
height: 125px;
text-indent: -9999px;
margin: 0 auto 18px;
}

.site-qr-introduce .icon-type-select {
background-size: 118px;//实际上变成了background-size:cover
background-position: 0 0;
background-repeat: no-repeat;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src=’/static/img/home/icon1.png’,
sizingMethod=’scale’);
}

父元素的width为125px,在ie下面是用filter进行缩放之后,background-size的属性就会变成cover,图片的宽度就会变成125px,而不是你想缩放的118px。所以就会出现如下弯曲的现象,这点需要注意一下。

QQ截图20150201233445

 

常见问题

笔者在使用过程中发生了一个问题。

QQ截图20150201233607

 

ie8下(ie8+也同样存在这个问题)

代码如下:

background-size: 118px;
background-position: 0 0;
background-repeat: no-repeat;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='/static/img/home/icon1.png',
sizingMethod='scale');
background-image: url(/static/img/home/icon1.png);

即如果你的css兼容是通过hack来实现(background-image与filter写在一起了),而不是通过header中判断根据不同浏览器加载不同的css文件(ie8以下加载filter所在的css文件,其他则加载background-image所在的css文件)。

 

针对这个问题,一个解决办法是判断浏览器分别加载不同的文件,另外一种解决方案暂时没有找到。

当然你可以使用PIE.htc来兼容css3,这个当然是题外话。

 

linode VPS东京节点测评

之前想跟同学拼起来买一个国外VPS,一方面自己可以放博客,其次也可以作为VPN来使用。

刚开始买了digitalOcean的西海岸节点,用paypal充了$10(再送$10),不过很失望,速度很慢。

我家是电信的宽带,平均的ping值在400ms+,其他同学校园网在300+。

 

后来打算转移到linode,linode的东京节点的口碑一直都在,不过前几天去买的时候Tokyo已经售完。

所以到今天刚买到新节点(买来的时候那个ip被墙,后来让客服换了免费一个ip)

linode东京节点的下载速度可以跑满我的4M宽带(400kb/s),大家可以自己测试(测试地址)。

现在这个网站就是放在linode VPS上的。

QQ截图20150201202959

 

公司的网站放在阿里云

QQ截图20150201203100

 

所以两者对比一下,linode Tokyo节点简直就是堪比国内的云服务器。

国内服务器的一个好处就是快,不过网站需要备案,费时间。买国外的VPS如果速度理想的话,那当作网站服务器来使用是很值得的,而且更是一个自己的VPN。

linode的一个麻烦的地方就是需要信用卡购买,各位没有信用卡的筒子就去借或者淘宝买吧。

各位买linode的时候愿意的话就输入这个referral:629ba8391b3170d838ab92f7e89570b0edd630a8

算是对我的奖励吧~

IE实现元素透明 —— IE系列黑魔法(一)

ie78元素透明

chrome/firefox: opactity(父元素设置之后、子元素也会被影响到)、background:rgba(xx,xx,xx,0) 父元素设置之后子元素不会被影响

ie:filter:alpha(opacity=0) (父元素设置之后、子元素也会被影响到)、

父元素 * {

position:relative;

}

使所有子元素脱离父元素、父元素设置透明不影响子元素

微信/移动端Web页面调试小技巧

(系统分析加分验证贴)最近突然就在做一个超级简易的微信订餐系统,开发这边首先就要解决的是怎么在微信上调试页面的问题。(写低端的技术贴好无聊的,纯当mark,以后老年痴呆了就可以用到,在1月1日就写技术贴,好不吉利的,不想注孤)。

1.  首先我想到的就是借鉴寻常的PC端调试方式,类似localhost/ordering这种方式

我用的是笔记本发Wifi,然后手机连发出来的Wifi,这样就保证了手机的网络是在电脑的局域网中,手机可以直接访问电脑中的页面。我电脑的Ip是 172.18.159.16, 其实手机就可以直接访问172.18.159.16/ordering, 不管在手机浏览器中,还是微信自带的内置浏览器中都可以成功访问

2. 第二种方式是在第一种方式的基础上进一步提升不过没有成功。成功搞定。

我不是太喜欢用localhost/xxxx 这种难看的写法的,我更加乐意直接域名访问。

本地apache开一个虚拟服务器,如果之前有设置过开启虚拟服务器的话,只要在vhost里面添加新的一行就可以了,serverName为 http://www.newyear.com,指向本地的www/ordering/ 文件夹中的Web文件,重启apache服务。

然后使用重定向神器Fiddler或者switchHosts,设置 127.0.0.1  www.newyear.com(我用的是switchHosts),设置完成以后就可以在PC端访问www.newyear.com 就可以直接访问本地的文件了。但是在手机端访问却失败了。

手机截图

写完上面一段就瞬间意识到问题了…. 我把127.0.0.1改成 172.18.159.16,就是我电脑的IP,就可以在移动端访问www.newyear.com 而访问本地的Web文件了。

手机截图

原因分析如下:在PC端的话,电脑请求www.newyear.com的DNS服务商获取对应的IP地址,由于本地127.0.0.1 对应了www.newyear.com ,所以直接访问了本地服务器中的地址,而不会再去万维网请求IP,而127.0.0.1是在PC端的角度请求的IP。但是在移动端,访问同样的域名,虽然通过Wifi请求了www.newyear.com,本地DNS返回的是127.0.0.1然后手机端再去请求自然就访问不到了,而设置成172.18.159.16,手机端就会去请求172.18.159.16,这就跟方法1的请求方式差不多了,自然就会成功。图示如下。

DNS请求流程