网站开发日志

Greasemonkey 控制链接的打开方式

如果你对HTML有所认识，你一定知道链接里有个属性叫target，当这个值被设"_blank"，该链接被点击后就会在新窗口(或者新标签)里打开；当这个值被设为"_self"或者不做设置时，该链接被点击后就在同一框架或窗口中打开。中国的网站设计倾向于使用第一种方法，因此当你在一个网站上多点几个链接(例如百度知道), 你的浏览器就会被这个网站'淹没'。相反，国外的网站倾向于使用第二种（好像这被认为是一种标准）。个人比较认同第二种方法，但是这种方法也有一种弊端，比如我在使用美味书签(delicious)，点击其中的一个书签后进入另外一个网站(在同一个窗口)，当离开这个网站的时候，我会自然而然地关闭窗口，这么一来美味书签也被关闭了。因此我觉得合理的做法应该是站内的链接在同一窗口打开，而站外的链接在新窗口打开。我在创建自己网站的页面时，都会尽量遵从这条规则，虽然我也有遗漏的时候，但是别人的网站我就根本无法控制了。

好在我们还是可以借助一个工具来解决这个问题，它就是Greasemoneky。不知道什么是Greasemonkey？它是Firefox的一个插件，你可以到这里下载。简单的讲Greasemonkey提供一个接口，可以导入用户自行创建脚本来控制页面的显示，就比如说我下面要介绍的：控制页面链接的打开方式。当然借助Greasemonkey你可以做的东西可多了，如果你有兴趣，可以到这里看看。

言归正传，下面是实现"站内的链接在同一窗口打开，而站外的链接在新窗口打开"的步骤：

1. 使用Firefox，据我所知Greasemonkey只支持Firefox。还没有Firefox？请点击下载：

2. 在Firefox里点击这里安装Greasemonkey。

3. 重启Firefox后，你会在Firefox的右下角看到一个可爱的猴头，那就是Greasemonkey。

4. 请确保Greasmonkey处于开启状态(金黄色的猴头代表开启，灰色的猴头代表关闭), 然后点击这里安装用户脚本。

5. 刷新页面，你就可以实现站内的链接在同一窗口打开，而站外的链接在新窗口打开。

有问题？请留言。

标签： Javascript

...阅读全文

PHP发送Gmail邮件加附件

前一段，我介绍了如何用PHP调用Gmail发送邮件，此方法只适用于发送文本邮件，也就是不支持附件发送。其实，要发送附件也不难，只是需要安装一个模块：Mail-Mime。下面就给大家做过详细介绍。

1.首先安装Mail-Mime, 你可以到pear网站下载后安装，如果你的机子装有Pear的包管理器，你直接运行下面的命令即可：

mail-mime pear install -o Mail_Mime
#在unbuntu下，使用sudo
sudo mail-mime pear install -o Mail_Mime

2. 使用下面的代码，这和PHP调用Gmail发送邮件一文中介绍的代码相识，不同的是多了Mail_Mime, 它是用来构造邮件的主题部分(内容和附件):

<?php
require_once "Mail.php";
require_once "Mail/mime.php";
//请用你的Gmail帐号和密码替代
$host = "smtp.gmail.com";
$username = "your-account";
$password = "your-password";
//定义收信人，发信人，以及主题和信息等
$from = "Adam<your@gmail.com>";
$to = "Cindy<someone@any.com>";
$subject = "Hi!";
$text = "Hi,\n\nHow are you?";
$html = "<b>hi</b>; 你也可以发送HTML格式的邮件
//定义附件路径和名称
$file = "/root/test/mail.php";
//如果你对下面的代码不熟悉，那么就请保留原样
$crlf="\n";
$headers = array (
	'From' => $from,
  	'Subject' => $subject);
$mime = new Mail_mime($crlf);
$mime->setTXTBody($text);
$mime->setHTMLBody($html); //发送HTML
$mime->addAttachment($file, 'text/plain');
$body = $mime->get();
$hdrs = $mime->headers($headers);
$smtp = Mail::factory('smtp',
  array ('host' => $host,
    'auth' => true,
    'username' => $username,
    'password' => $password));
$mail = $smtp->send($to, $hdrs, $body);
if (PEAR::isError($mail)) {
  echo("<p>" . $mail->getMessage() . "</p>");
 } else {
  echo("<p>Message successfully sent!</p>");
 }
?>

注意：在上述代码里，我使用的附件内容类型是文本(content-type:text/plain)。如果你要发送PDF，图片，ZIP等其他文件类型，你可以使用下面的代码代替：

$mime->addAttachment($file, 'text/plain'); //文本
$mime->addAttachment($file, 'application/pdf'); //PDF
$mime->addAttachment($file, 'image/gif'); //图片
$mime->addAttachment($file, 'application/zip'); //ZIP

关于content_type (内容类型)，请参考：w3schools的介绍

标签： PHP

...阅读全文

PHP中的值是否为空

在百度知道看到一个网页提问，是关于PHP中的值是否为空。这个问题还是相对简单，参考PHP手册，以下几种情况在PHP里被定义为空：

"" (an empty string)
0 (0 as an integer)
"0" (0 as a string)
NULL
FALSE
array() (an empty array)
var $var; (a variable declared, but without a value in a class)

掌握这些规则，我们就可以对下面的PHP变量进行是否为空的判断。

<?php
$a1 = null;
$a2 = false;
$a3 = 0;
$a4 = '';
$a5 = '0';
$a6 = 'null';
$a7 = array();
$a8 = array(array());
echo empty($a1) ? 'true' : 'false';  //true
echo "<br>";
echo empty($a2) ? 'true' : 'false';  //true
echo "<br>";
echo empty($a3) ? 'true' : 'false';  //true
echo "<br>";
echo empty($a4) ? 'true' : 'false';  //true
echo "<br>";
echo empty($a5) ? 'true' : 'false';  //true
echo "<br>";
echo empty($a6) ? 'true' : 'false';  //false, 因为$a6不是空字符串也不是'0'
echo "<br>";
echo empty($a7) ? 'true' : 'false';  //true
echo "<br>";
echo empty($a8) ? 'true' : 'false';  //false，因为$a不是空数组
?>

标签： PHP, 百度知道

...阅读全文

CSS line-height

在百度知道里，看到一位网友提问有关line-height的问题。

HTML+CSS代码如下：

<html>
</head>
<style type="text/css">
#a{ height:90px; width:400px; line-height:60px;background:#003399;}
#b{background:#FF6600; width:200px; height:25px;}
</style>
<body>
<div id=a>
<div id=b>ddd</div>555
</div>
</body>
</html>

请测试以上代码，为什么id=a的div设了line-height:60px后 id=b的div 高度设为25px，实际却等于60px呢？怎么样才能在父级div设了line-height的情况下，控制自身的高度。请在IE6里面测试。看代码id=b的div高度应该是25px;可在IE6里面实际却是60px。在firefox里高度就是25px,可里面的文字，却跑到外面了。

分析：line-height(行高)是有继承性的。在上述例子里，div(a)的行高=60px，div(b)是div(a)的子级。如果div(b)没有定义行高，那么它将继承父级的行高。由于div(b)的高度是25px，小于行高(60px), 在firefox下文字就跑到div的外面，而在IE6下，当div的高度小于行高，div的高度将被自动扩大，因此显示为60px。

解决方法：给子级定义行高，覆盖继承值。CSS如下：

#b {background:#FF6600; width:200px; height:25px;line-height:25px;}

标签：百度知道

...阅读全文

jQuery + CSS 制作上下滑动卷页

有网友问：

（博客）左下角那个点击可以上下滑动是怎么制作的。

我在日志里曾经介绍过jQuery 动画卷页。这个特效就是采用类似的jQuery代码，不同的是多了一些CSS代码。下面我将简单介绍如何制作这个特效。

1.html代码：

<div id="footerud">
  <div id="up"></div>
  <div id="down"></div>
</div>

注意：你可以把这段代码放在<body>和</body>之间的适当位置，例如：</body>前。

2. css代码：

#footerud{
  bottom:10px;display:block;position:fixed;left:15px;
}
#up{
  background:url(../images/arrowtop.png) no-repeat;
  cursor:pointer;height:14px;margin-bottom:15px;
  position:relative;width:25px;
}
#down{
  background:url(../images/arrowbottom.png) no-repeat;
  cursor:pointer;height:60px;margin-top:15px;
  position:relative;width:25px;
}

#up和#down里定义了背景图(也就是上下箭头)，你可以用你喜爱的图片代替，我这两个也是网上找到。注意：../images/指定了图片相对CSS文件的路径，你可能要根据你的实际情况更改。

3. jQuery代码：

jQuery(document).ready(function() {
  jQuery('#up').click(function(){
    if(jQuery.browser.safari) {//这里判断浏览器是否为safari
      jQuery('body').animate({scrollTop:0}, 'slow');
      return false;//返回false可以避免在原链接后加上#
    }
    else{
      jQuery('html').animate({scrollTop:0}, 'slow');
      return false;
    }
  });
   jQuery('#down').click(function(){
    if(jQuery.browser.safari) {//这里判断浏览器是否为safari
      jQuery('body').animate({scrollTop:jQuery('#footerPan').offset().top}, 'slow');
      return false;//返回false可以避免在原链接后加上#
    }
    else{
      jQuery('html').animate({scrollTop:jQuery('#footerPan').offset().top}, 'slow');
      return false;
    }
  });
});

这个在jQuery 动画卷页一文里有介绍，如有不明白的地方请留言。注意：向上翻页比较简单，用scrollTop:0就可以了，但是向下翻页，必须指明你的页面最底部HTML元素，例如：我用到 scrollTop:jQuery('#footerPan').offset().top. 这里#footerPan就是我博客页面底部HTML元素的ID。

标签： CSS, Jquery

...阅读全文

PHP调用Gmail发送邮件

大家对PHP的mail()函数一定都很熟悉，它简单易用，这里就不介绍了。如果你不知道怎么用，请查看PHP的在线手册。但是mail()并不是在任何服务器上都可以用的。下面是两个使用mail()的主要先决条件:

1.服务器必须安装有sendmail
2.smtp服务器无需鉴权(authentication)

比如自家的服务器，我在'Ubuntu命令行发送邮件到远端'一文里介绍过这个问题。今天我准备介绍另外一种方法: PEAR:Mail + Gmail。首先，安装PEAR Mail，这需要3个模块：NET/SMTP, Mail，Net/Socket。

如果你用的是RedHat，具体步骤如下：

1. 下载文件：
# cd /tmp
# wget http://download.pear.php.net/package/Mail-1.1.14.tgz
# wget http://download.pear.php.net/package/Net_SMTP-1.2.10.tgz
# wget http://download.pear.php.net/package/Net_Socket-1.0.8.tgz
2. untar 所有文件：
# tar -zxvf Mail-1.1.14.tgz
# tar -zxvf Net_SMTP-1.2.10.tgz
# tar -zxvf Net_Socket-1.0.8.tgz
3.安装文件:
# cd /usr/share/pear
# mkdir Net
# cd Net
# cp /tmp/Net_SMTP-1.2.10/SMTP.php .
# cp /tmp/Net_Socket-1.0.8/Socket.php .
# cd ..
# cp -avr /tmp/Mail-1.1.14/Mail/ .
# cp -avr /tmp/Mail-1.1.14/Mail.php .

如果你用的是Ubuntu，相对要简单一些：

1.如何你还没有装PEAR:
sudo apt-get install php-pear
2.有了pear以后，直接使用下面的命令：（提示：使用 ‘--alldeps’ 可以自动安装Mail的相关模块)
sudo pear install --alldeps Mail

安装好Pear的Mail模块后，你就可以使用PHP代码调用Gmail来发送邮件了。下面的代码可供参考：

<?php
require_once "Mail.php";
 
$from = "Adam <adam@gmail.com>";
$to = "Cindy <cindy@61dh.com>";
$subject = "Hi!"; //邮件主题
$body = "Hi,\n\nHow are you?"; //邮件内容
 
$host = "smtp.gmail.com";
$username = "adam"; //gmail用户名
$password = "mima-pass"; //gmail密码
 
$headers = array ('From' => $from,
'To' => $to,
'Subject' => $subject);
$smtp = Mail::factory('smtp',
array ('host' => $host,
'auth' => true,
'username' => $username,
'password' => $password));
 
$mail = $smtp->send($to, $headers, $body);
 
if (PEAR::isError($mail)) {
echo("<p>" . $mail->getMessage() . "</p>");
} else {
echo("<p>Message successfully sent!</p>");
}
?>

参考资料：

https://help.ubuntu.com/community/PhpPear
http://www.cyberciti.biz/tips/howto-php-send-email-via-smtp-authentication.html

标签： Linux, PHP

...阅读全文

几个HTML编码的良好习惯

坚持做一件事情真的很难，就比如说坚持写Blog。最近写文章的频率明显下降，也许是最近比较忙，但是也可能这只是借口。

另外也有好几周没上Nettut了，今天看到了这篇30 HTML Best Practices for Beginners，觉得写得比较好，在此推荐给大家。没有准备全文翻译，只是针对自己没有做好的几点做个‘检讨’:-)

1. 坚决不用inline的CSS样式

<p style="color: red;">
  这段字体为红色
</p>

专家建议只有在页面HTML代码完成后才考虑CSS样式。不要图一时方便，把CSS样式直接加入HTML标签里。

2. 把所有外部CSS代码都放在Head标签里

通常情况下我也是这么做的。这么做的首要目的是，加快页面的加载速度。

3. 学会使用Firebug

Firebug也是我喜欢的Firefox扩展插件，但是我从来没有认真的研究过它的功能。专家提示：大部分Firebug用户只用到体验到2成的Firebug提供的功能。看来要找时间好好的学习学习。

下面是两个资源：

4. 使用H1-H6标签

从词意学上讲，使用H1-H6标签对SEO比较有帮助。因为H - 代表标题，而P代表段落，所以用H(例如H6）代替P，有利于搜索引擎的对文章内容的获取。

5. 下载使用ySlow

还没用过，专家建议下载使用ySlow，是配合Firebug的Firefox插件，可以对现有网页进行优化分析。刚刚下载了，貌似不错。

6. 网站完成后，压缩代码

下面几个网站提供JS和CSS压缩的服务。其实我也用过，只是每次更新网站，要重复解/压缩，觉得有点烦。

7. 学习Photoshop

学习中... 下面是专家建议的PS学习网站，有空一定去看看。

Visit the Videos section at Psdtuts+

Enjoy the "You Suck at Photoshop" series.

标签： CSS, HTML

...阅读全文

网站开发日志

Greasemonkey 控制链接的打开方式

PHP发送Gmail邮件加附件

PHP中的值是否为空

CSS line-height

jQuery + CSS 制作上下滑动卷页

PHP调用Gmail发送邮件

几个HTML编码的良好习惯

关于

上一个

存档