Vixual

在网页界已经有很多的“下拉选单”程式了，不过似乎都搞得太过复杂或太华丽了。

其实下拉选单的原理很简单，一开始只是先让“子选单”隐藏，当鼠标移至“主选单”时再让子选单显示。因此，只要能控制网页元件的 display 样式属性就已经成功一半了。

因为本人喜欢重新发明轮子，所以也写了一个简易的网页下拉选单的程式，可以做为初学者入门的参考。

在范例的原始码中，我尽量让程式码看起来浅显易懂，并且只用 JavaScript，不使用 jQuery 或其它 Framework。我也尽量多写一些注解，希望 JavaScript 的初学者能看得懂。

Read more

如果想学 jQuery 的话，可以从下列的教学资源开始，读者应具有 HTML、JavaScript、CSS 的基础。

网站

上官林杰 - ericsk (2007)

1. jQuery 学习心得笔记 (1) – 前言
2. jQuery 学习心得笔记 (2) – 怎么使用 jQuery 来写 JavaScript
3. jQuery 学习心得笔记 (3) – jQuery 的事件(Event)处理
4. jQuery 学习心得笔记 (4) – Ajax (上)
5. jQuery 学习心得笔记 (5) – Ajax (下)
6. jQuery 学习笔记 (6) - 操作 DOM 物件
7. jQuery 学习笔记 (7) - 扩充 jQuery

以上这几篇是我的 jQuery 启蒙文章。
Read more

今天看到 Flickr 改版的资讯，我才想起我好像有一个 Flickr 帐号已经很久没登入了!!

不过去到 Flickr 网站却已经找不到“Google 帐号”的登入选项了 (当时我的 Flickr 是用 Google 帐号)!

查了一下，原来 Yahoo 已经在 2014 年 6 月之后就取消透过 Facebook 和 Google 的帐号登入功能了! 在 2014 年 6 月之前还可以让你以 Facebook 及 Google 帐号登入之后转换成 Yahoo 的帐号，现在则是超过转换的日期而不得其门而入了。

该怎么办呢?

原来可以透过 Yahoo 的“密码小帮手”重设 Google 帐号的密码来登入 Flickr。
Read more

本站曾用过 Limit Login Attempts 这个 WordPress 的外挂程式，用以防止被暴力破解登入密码。当有人一直以错误的密码进行登入时，就会对其 IP 进行几个小时的封锁，然后 mail 通知你又有什么 IP 被封锁了，效果其实也还不错。

不过其实只要用“.htaccess 的权限认证方式”，就可以针对 wordpress 的 wp-login.php 这个单一档案做防护，也可以达到很好的效果。

.htaccess 认证

首先找一个安全的地方放置 .htusers 这个档案。所谓的“安全”，是指至少不要在网页可以被下载到的路径。.htusers 的设定方式请参考本站另一篇文章:

• .htaccess 的权限认证方式

密码请不要用跟 WordPress 原本的登入密码一样。

编辑 wordpress 目录下的 .htaccess，在档案最后如入:

AuthType Basic
AuthName "Restricted Area"
AuthUserFile "/path/to/.htusers"
<Files wp-login.php>
require valid-user
</Files>

如果你想进一步针对整个 wp-admin 目录做防护，则进到 wordpress 下的 wp-admin 目录，新增或编辑 .htaccess，一样在档案最后如入:

AuthType Basic
AuthName "Restricted Area"
AuthUserFile "/path/to/.htusers"
require valid-user

参考网页

• Dynamic Drive: .htaccess password generator
• 限制WordPress后台登入次数、封锁IP、防骇客入侵 – 香肠炒鱿鱼
• 帮WordPress后台筑城墙 « 高登工作室
• 隐藏 WordPress 后台网址 « 高登工作室
• WordPress 如何防范暴力攻击 Brute Force Attack « 高登工作室

状况一

经常看到某些才成立没有多久的 Facebook 专页，就已经有数以万计的粉丝按赞了。例如: 放弃治疗。

这个专页加入 Facebook 的时间还不到一个月，竟然就有 17 万个粉丝按赞:

状况二

又或者是，在你个人的 Facebook 页面会无缘无故出现一些你没有分享过，也没有按赞的内容!!

这到底是你的 Facebook 帐号被盗用? 还是电脑中毒? 还是得了失忆症? 还是自己眼花了?

Read more

主要步骤

Discuz! 没办法直接从 7.2 升级至 X3.0，中间需先升级至 X1.5 或 X2.0 才行! 主要的升级步骤如下:

1. 将 UCenter 升级至 1.6.0
2. 全新安装 Discuz! X2.0，安装时选“仅安装 Discuz! X (手工指定已经安装的 UCenter Server)”
3. 转换 Discuz! 7.2 的数据库至 Discuz! X2.0
4. 升级至 Discuz! X3.0

你需要准备的帐号、密码:

1. Discuz! 7.2 的数据库名称、帐号、密码
2. UCenter 创始人的密码
3. Discuz! 7.2 的管理者帐号、密码

升级前请先至 Discuz! 的管理中心关闭站点。

Read more

因为 Google Reader 关了，想到 RSS 这样方便的东西在未来可能也会有被抛弃的一天，所以才想要开始经营 Facebook 的粉丝页。Google 这样的作为，没让 Google+ 得利，反而让 Facebook 更有机会成为网络上最大的资讯来源。

本站的 Facebook 粉丝页冷冷清清的，写这些文章也不是为了赚钱，如果觉得 Blog 的内容还不错的话，还希望大家按个赞来 follow 一下:

不过每次在 Blog 写个文章还要自己把网址贴到 Facebook 粉丝页实在有点麻烦，还是来找找看有没有比较简单的方法好了...

这是我在 Facebook 上看到的安全资讯，我觉得很重要，也适用在任何的网站套件上。

以 WordPress 为例，首先，请查看你的 WordPress 目录下是否有这些档案:

Read more

最近变更网页的布景主题, 也插入了 Adsense 的广告。网页在 Firefox、Chrome 的显示都正常, 唯独在 IE8 却会出现 "800a03e8" 的 Javascript 错误, 有时甚至连网页都无法显示!!

画面如下:

解决方法:

因为新的布景主题有加入了 IE7 的 "相容性检视", 只要把这一行从布景主题的原始码删除即可:

<!meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

这样做了的缺点是，以后只能使用 IE8 允许的标准设计网站!!不过这也不算什么缺点，毕竟 IE 过去都不按照 W3C 的网站设计标准走。

2017/03/21 更新:

可能是之前为了要相容旧版 IE (v9.0 之前) 的缘故，所以没发现到 JavaScript 还有 querySelector() 与 querySelectorAll() 这两个函式，它们的功能分别为:

• querySelector(): 回传第一个符合选择器规则的元素
• querySelectorAll(): 回传全部符合选择器规则的元素

从范例中可以得知，这两个函式遵循 CSS 语法，可以实现复杂的 CSS 选择器的层级、属性、分组、串联、伪元素...等判断，功能已不是 getElementById()、getElementsByClassName()、getElementsByTagName() 可以比拟!

当然复杂的 CSS 层级可改由 querySelector() 或 querySelectorAll() 来取得元素，不过若是目标明确，考量效率我还是用 getElementById() 来处理可能会比较好。

自订函式 $$() 改写如下:

function $$(element, isFirst){
    if(isFirst === 1){
        // 强制回传第一笔符合的元素
        return(document.querySelector(element));
    }
    else if(/^\#[\w\-]+/.test(element)){
        // 以 $$("#id") 回传元素
        return(document.getElementById(element.slice(1)));
    }
    else{
        // 回传元素阵列
        return(document.querySelectorAll(element));
    }
}

($$() 增加了第二个参数: isFirst，若设为 1 则强制回传第一笔符合 CSS 选择器的元素，而非元素阵列)

之前的内容:

自订函式

JQuery 强大、方便的选择器 (Selector) 是 jQuery 不可或缺的功能之一。不过如果我们不想加载 jQuery 而只想使用类似 jQuery 选择器的功能，那可以用自订函式的方式做到:

function $$(element){
    switch(element.charAt(0)){
    case("#"):
        // 以 $$("#id") 回传元素
        return(document.getElementById(element.slice(1)));
    case("."):
        // 以 $$(".class") 回传元素阵列，IE 要 v9.0 之后才支援
        return(document.getElementsByClassName(element.slice(1)));
    default:
        // 以 $$("tag") 回传元素阵列
        return(document.getElementsByTagName(element));
    }
}

或是单纯一点，仅传回指定 id 的元素就好:

function $$(element){
    return(document.getElementById(element));
}

我把这个自订的函式命名为 $$()，用以与 jQuery 的工厂函式 $() 做区隔。

但是要注意，以上自订函式回传的都是 DOM 元素，与 jQuery 在其它操作上并不相同。

换掉 jQuery 的工厂函式

如有需要也可以用 jQuery.noConflict() 换掉 jQuery 的工厂函式 $()，ex:

var jq = jQuery.noConflict();

这样就能改用 jq() 来做为 jQuery 操作，而原本的 $() 只要再次重新定义为自订函式即可使用，不会与 jQuery 冲突。

帮大家试过用 € 与 ¥ 做为自订函式的名称，不过都失败，大家可以不用试了!

参考网页

• [jQuery]中文的 jQuery 教学资源 | Vixual
• [jQuery]《网页设计-爱上jQuery》读书心得及评论 | Vixual