2010年3月22日 星期一
[FX] 常用Firefox套件推薦
一般使用者
https://addons.mozilla.org/zh-TW/firefox/collection/ef94ad57-2292-21b6-83f2-90dcdcb78c29
網頁開發者
https://addons.mozilla.org/zh-TW/firefox/collection/f707b455-bbc2-95cf-f14c-fc1baad63239
2010年3月20日 星期六
Iptables 限制每個 ip 連線數
如果在 Linux 下要限制每個 ip 的連線數,可以透過 iptables 實現。詳細指令語法如下:
/sbin/iptables -A INPUT -p tcp –syn –dport 22 -m connlimit –connlimit-above 3 -j REJECT
限制每個 ip 只可以有 3 個 ssh 連線 (預設 ssh 使用 port 22)。
/sbin/iptables -A INPUT -p tcp –syn –dport 80 -m connlimit –connlimit-above 20 -j REJECT –reject-with tcp-reset
只接受每個 ip 20 個 http 連線 (httpd.conf 裡面的 MaxClients 預設是 60)。
要留意的是,這個設定可能會把 proxy servers 阻隔,因為每個 proxy servers 可能會建立大量的連線。
Skip proxy server IP 1.2.3.4 from this kind of limitations:
/sbin/iptables -A INPUT -p tcp –syn –dport 80 -d ! 1.2.3.4 -m connlimit –connlimit-above 20 -j REJECT –reject-with tcp-reset
這句的作用跟上面語法一樣,只是把已知的 proxy server (1.2.3.4) 給開通,避免阻隔 proxy servers 的連線。
In this example, limit the parallel http requests to 20 per class C sized network (24 bit netmask)
/sbin/iptables -A INPUT -p tcp –syn –dport 80 -m connlimit –connlimit-above 20 –connlimit-mask 24 -j REJECT –reject-with tcp-reset
這個是限制同一個 class C 網絡同時建立 20 個連線。
如果想把在指定時間內建立過多連線的 ip 阻隔,這便要編輯 iptables 的 shell script。
以下例子會阻隔在 100 秒內建立多於 10 個 http 連線的 ip
#!/bin/bash
IPT=/sbin/iptables
# Max connection in seconds
SECONDS=100
# Max connections per IP
BLOCKCOUNT=10
# ….
# ..
# default action can be DROP or REJECT
DACTION=」DROP」
$IPT -A INPUT -p tcp –dport 80 -i eth0 -m state –state NEW -m recent –set
$IPT -A INPUT -p tcp –dport 80 -i eth0 -m state –state NEW -m recent –update –seconds ${SECONDS} –hitcount ${BLOCKCOUNT} -j ${DACTION}
# ….
# ..
要儲存 iptables 的修改可以查看 iptables-save 的 man page,在 redhat 下是用以下指令:
service iptables save
2010年3月17日 星期三
從 js 到 jQuery 之八:AJAX 非同步的傳輸
標題 [心得]從 js 到 jQuery 之八:AJAX 非同步的傳輸
時間 Sun Nov 30 17:10:48 2008
大概從2005年迄今 , 在當時幾乎非程式人員都不知道ajax ,
到現在幾乎當紅的網站都打著 ajax的名號 ,
筆者印象很深刻的是 , 2006年我開始正式接觸碰ajax的時候 ,
就在ajax版留下「why ajax」的文章 , 雖然沒得到什麼回應 .
後來也緊接著就寫出屬於自己包裝過的介面跟試用dojo,
很多東西並不是很難或是很高深莫測 , 有時候就只是差一個「介紹」。
如果還有認為ajax很神秘的朋友 , 這篇文章讓我們就ajax本質重新討論起,
筆者曾經在討論這個問題時被說成是個ajax基本教義者 ,不過瞭解工具 ,
絕對是能妥善發揮工具威力的必要條件.
AJAX = Asynchronous JavaScript and XML 非同步javascript & xml
從js 到 jQuery 之二:無所遁形之 selector
標題 [心得] js 到 jQuery 之二:無所遁形之 selector
時間 Fri Aug 8 02:52:24 2008
上一篇不含開頭簡介就爆了一百多字, 這篇得更精簡用詞才行.
會想學 js的有兩種人 , 一種是希望看完之後自己會寫會改的 ,
另一種則是希望來找些語法copy and paste的 ,
基本上體驗部份是為後者設計的 , 而文章內文主要是寫給前者看的,
我寫的很口語 , 希望你們以「跟程式語言聊天」的心情來看這些文字.
jquery呢? 我會說它是對兩者都適合的,
他可以簡單到一行就能完成 , 也能讓人很方便的去寫去改.
希望你們看完這幾萹文章不會被誤導 , 不是所有事情都能一行被完成 ,
但是它能讓你在思考上保持「簡單」.
從 js 到 jQuery 之一:javascript的魔力
標題 從 js 到 jQuery 之一:javascript的魔力
時間 Thu Aug 7 02:10:01 2008
有鑑於javascript常常讓人望之卻步 , 興起用下班時間寫一些教學的念頭,
畢竟想做就該找方法 , 不太應該拿下班當理由 ,
簡單用700~1000字為 jQuery及js的觀念寫一系列的文章.
主要希望讓沒碰過的朋友們能有基礎 , 讓碰過的朋友們能加強觀念.
當然為了增加吸引力 , 每章最後都來放個實做案例好了...XD
前三章應該主要還是在dom(document object model ).
────────────────────────────────
第一章主要是要講什麼是javascript , 他在網頁設計上扮演著什麼角色,
算是讓沒有基礎的使用者可以用來銜接用的 , 有基礎的版友可能會比較失
望一點.
────────────────────────────────
從 js 到 jQuery 之三:可怕的事件叢林
標題 [心得]從 js 到 jQuery 之三:可怕的事件叢林
時間 Sat Aug 9 02:57:09 2008
感謝前兩篇各位版友的不吝支持 , 接下來要推出第三篇 ,
還請各位版友多多指教、討論。︿︿
希望看完這篇 , 你們能瞭解網頁上得事件有哪些 ,
以及為什麼事件在跨平台這件事情上是件很棘手的事情.
────────────────────────────────
繼「無所遁形的selector」一文體驗到的強大 jquery selector ,
暫且讓我們放下 jquery 物件的各種attr css 的屬性不談 ,
先來談談我們之前所講過 , javascript最重要的觸發點:事件.
從 js 到 jQuery 之三 jQuery事件補充資料
標題 [心得]從 js 到 jQuery 之三 補充資料
時間 Sat Aug 9 23:10:52 2008
由於本系列文章主題是「從js到jquery」 , 所以主要內容在於對比 js
到 jquery之間 , 究竟改善了什麼 , jQuery究竟可以對我們有什麼助益 ,
順便介紹jQuery的一些常用的plug-in.
目前是預定一天一篇主題 , 主題目前規劃約十篇左右 ,
主題從簡介js , 基本dom操作 , 到進階的元素瀏覽(Traversing) ,
再到 effects 跟一些頁面操作 (manipulation),
我想 , 我的目標是希望讓它變得很有趣 . :)
────────────────────────────────
礙於篇幅 , 個人經驗是bbs 適合閱讀的字數約800~1000字 , 約4-5頁 ,
內容沒有辦法專注於 jQuery的介紹 , 而僅摘出筆者認為適合的內容,
於是在有必要與討論互動的狀況下 , 另開補充資料來彌補介紹文章不足.
從 js 到 jQuery 之四:屬性與樣式
標題 [心得]從 js 到 jQuery 之四:屬性與樣式
時間 Sun Aug 10 04:09:23 2008
副標容我再強調一下 , 瀏覽器的真正戰場,
不僅僅是 瀏覽器相容 , 也代表著javascript真正發揮作用的地方.
講到這章真的是讓筆者感到萬般無奈 , 從以前作表單必填欄位採取
自訂attr策略, 到設定各種css屬性 , attribute 跟 css樣式 ,
一直都是筆者寫純js時期的痛 , 且聽筆者慢慢道來.
為了撰文方便 , 底下簡稱 attribute 為 attr.
從 js 到 jQuery 之五:巡覽‧跳過來跳過去
標題 從 js 到 jQuery 之五:巡覽‧跳過來跳過去
時間 Sun Aug 10 23:44:25 2008
十篇的目標看來越來接近了 , 行百里半九十 , 繼續努力. :)
由於前面我們介紹了不少基礎知識 , 接下來的篇幅應該可簡單一點.
從 js 到 jQuery 之六:五光四色的特效世界
標題 [心得]從 js 到 jQuery 之六:五光四色的特效世界
時間 Tue Aug 12 11:45:59 2008
本章一開始 , 我們先來看看一個小弟精心準備的小小demo吧.
http://tonyq.org/jqtalk/jq6_effectDemo.html
從 js 到 jQuery 之七:網頁元素的工廠美學
標題 [心得]從 js 到 jQuery 之七:網頁元素的工廠美學
時間 Mon Aug 18 02:08:43 2008
本來以為兩天就可以回軌道的 , 竟然用了五天, 而且時間還壓的很緊.orz
我下週末應該兩天會在coscup 2008會場 , 因為所有講題看起來都蠻有趣的 ,
有報名的版友或認識的朋友們可以約一約聚聚.^^~
coscup 2008 http://coscup.org/2008/
另外幫朋友打打廣告 yahoo! open hackday ! 在9月中旬要登場囉,
有興趣參加的朋友請參考
活動首頁 http://hackday.ithome.com.tw/yahoo/index.html
活動討論區 http://tw.mb.yahoo.com/ydn/yui/board.php
工商服務時間講的夠多了 , 接下來讓我們繼續進入jQuery 本文吧!
從 js 到 jQuery 之九:plug-in
標題 [心得] 從 js 到 jQuery 之九:plug-ins
時間 Sun Nov 30 17:11:00 2008
從這章開始就跟傳統js比較脫節了,介紹jQuery的細部應用。
這一章的目標是幫助讀者們瞭解現有的plug-in是如何而來,
以及如何按照自己的需求撰寫自己的plug-in (if need).
先提一個名詞定義:
jQuery context 指的是 $("div") 這類已經經過jQuery init過的物件。
(註:這只是筆者方便講解區分用,不一定是正式定義.)
2010年3月14日 星期日
駭客想得和你不一樣!
上週五在一個場合中,
被某單位長官問到:「為什麼這麼多單位通過了資安認證後,卻還是被黑得很慘。」
我當下的回答是:
「管理者與技術人員常站在各自的角度去思考如何有解決問題,
在資安管理與資安技術上,往往各做各的,
無法有效的銜接,也因此產生了許多被忽略的gap(間隙),
造成表面上看起來該做的都有做了,
但還是不斷被駭客給入侵的事實。」
事實上,除了上述回應外,
還有一個很重要的觀點,
就是多數資安人員並沒有嘗試從駭客角度去思考,
而是從過去所受的正統教育方式去做正向思考的防禦,
而忽略了其實~「駭客想得跟你不一樣」!
由於之前在一些場合也曾經分享過相關的內容,
所以趁著今天宅在家看道奇台灣第三戰的時候,
順便整理一下並分享出來好了。
用 jQuery 做畫廊 – jQuery 版的 Nike 首頁產品展示
昨天梅干傳了一個 Nike.com.tw 的網址過來,讓筆者以為梅干要轉行賣鞋或是透過他買鞋可以拿到流血價咧!結果是...看到了它首頁的產品展示效果蠻不錯的,想討論看看是否能用 jQuery 來做出類似的功能。
利用 jQuery 來製作網頁頁籤(Tab)
在網路知識爆炸的 Web 2.0 時代,一個頁面上要顯示的資訊越來越多,但總不可能把全部的內容都一次顯示出來塞滿整頁吧!所以就出現了頁籤(Tab)這樣的展示方式。
[Tool]Zen-coding : Set of plugins for HTML and CSS hi-speed coding
MSDN 3/26開發講座-軟體工程實務與軟體測試經驗談
"
跨瀏覽器 CSS3 代碼生成器
可憐天下 web developers 不知花了多少光陰在支援不同瀏覽器上。Internet Explorer 就甭提了,即使 Safari、Firefox 都支持的陰影(box-shadow)效果,偏偏都有不同寫法。結果就是同一件事情要寫好幾次,不幸要修改數值的話又要連續改數次。杯具啊……(還是都習慣了?)
原本簡單一個陰影效果往往要六行 code 才可以搞定:
.box_shadow {
-moz-box-shadow: 1px 0px 4px #ffffff; /* FF3.5+ */
-webkit-box-shadow: 1px 0px 4px #ffffff; /* Saf3.0+, Chrome */
box-shadow: 1px 0px 4px #ffffff; /* Opera 10.5, IE 9.0 */
filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=1px, OffY=0px, Color='#ffffff'); /* IE6,IE7 */
-ms-filter:'progid:DXImageTransform.Microsoft.dropshadow(OffX=1px, OffY=0px, Color='#ffffff')'; /* IE8 */
}
為瞭解決這個問題,我在此隆重介紹~ CSS3 Please.com- 一個網上 跨瀏覽器 CSS3 代碼生成器。以後寫 CSS3,只需修改一處地方,網站自動幫你更新其他瀏覽器的代碼。支持的效果有圓角 border-radius、陰影 box-shadow、漸變、移動 transform等,而且還會最大限度地支援各個瀏覽器:Internet Explorer, Safari, Chrome, Firefox, Opera。比較意外的是,原來有不少效果在 Internet Explorer 下可以靠 filter (DXImageTransform) 來達成,如果要自己寫的話,大概要花不少時間查文檔吧。
"黑暗jQuery工具包1-動態加入預設Style設定
對我來說,Javascript在處理CSS上一直有一個小困擾...
一般在習慣上,為了方便開發人員修改,多半會將Style設定獨立放在.css檔案裡,應用者可視需要覆寫或修改之。但有蠻多時候,應用者根本不打算更動CSS內容,只想直接沿用預設CSS設定,但部署時還是少不了要Copy相對應的.css檔案,網頁也必須多加上<style src="...">宣告。
我總覺得,最理想的方式是將預設css與js融和在一個檔案裡。當開發者想自行定義CSS樣式,可將其寫在.css中加以引用,或在HTML中以<style>逕行宣告;若只想用預設內容,則只需參照.js就大功告成。
今天遇到類似需求,索性寫了幾個小函數,試著實現上述想法。
我的設計概念是這樣的: 先透過document.styleSheets.cssRules比對某個CSS Selector(例如: div.cCountryPicker),若已被定義過,表示網頁已透過參照.css檔或直接宣告<style type="text/css">方式定義了div.cCounterPicker,此時就不需加入預設的div.cCountryPicker樣式規則;反之,若沒有定義該規則,則透過$("head").append("<style type=\"text/css\">....")的方式加入Style宣告。
程式碼如下:
(PS: 我規劃用jQuery.Darkthread.*蒐集我陸續開發出來的工具函數,最前面的$.extend用來將多個.js中宣告的jQuery.Darkthread.*函數彙整在一起)
/*
** Darkthread's Tools for jQuery ver 1.0 **
by Jeffrey, 2010-02-25, http://blog.darkthread.net
=======================================================
checkStyle: to check if specific style selector is defined
addStyles: add <style type="text/css"> dynamically
addDefaultStyles: if specific style selector isn't defined, add style setting
*/
jQuery.extend(jQuery, { Darkthread: {} });
jQuery.extend(jQuery.Darkthread, {
tools: {
//ruleSelector sample: a:hover, .myClass, #someId
checkStyle:
function(ruleSelector) {
//REF: http://www.javascriptkit.com/dhtmltutors/externalcss3.shtml
var cssCol = document.styleSheets;
ruleSelector = ruleSelector.toLowerCase();
for (var i = 0; i < cssCol.length; i++) {
var rules = cssCol[i].cssRules || cssCol[i].rules;
for (j = 0; j < rules.length; j++)
if (rules[j].selectorText.toLowerCase() == ruleSelector)
return true;
}
return false;
},
/*styleDictionary sample:
{
"a:hover": { "background-color": "red", "color":"yellow" },
"#dvTest": { "border", "solid blue 1px" }
}
Note: it's for <style> declaration, not for jQuery.css, so don't use
backgourndColor instead of "background-color"
*/
addStyles:
function(styleDictionary) {
var sb = [];
for (var selector in styleDictionary) {
sb.push(selector + " {");
var props = styleDictionary[selector];
for (var p in props) {
sb.push(p + ":" + props[p] + ";");
}
sb.push("}");
}
$("head").append("<style type=\"text/css\">\n" +
sb.join("\n") + "\n</style>");
},
addDefaultStyles:
function(ruleSelector, styleDictionary) {
if (!$.Darkthread.tools.checkStyle(ruleSelector))
$.Darkthread.tools.addStyles(styleDictionary);
}
}
});
應用方式挺簡單的,將以下的程式寫進.js,等於將預設的.css一起藏進.js裡,就不必再多搞出一個預設用途的.css檔案囉!
$.Darkthread.tools.addDefaultStyles(".dttl_BookingBlock", {
".dttl_BookingBlock": {
float: "left", position: "absolute",
margin: "0px", padding: "0px", height: "100%",
"font-size": "9pt", "background-color": "#dddddd",
"border-left": "solid #444444 1px",
"border-right": "solid #444444 1px"
},
".ddtl_Timeline": { border: "solid red 1px" }
});
(以上的程式碼,會在網頁本身沒有宣告.dttl_BookingBlock且所有參照的.css中也沒有該宣告時,加入.dttl_BookingBlock及.dttl_Timeline兩條CSS規則,賦與預設Style設定。)
"30+最新強大jQuery插件和教程
jquery的廣泛使用已經讓人快忘記了其它javascript框架的存在,甚至有時候會忘記了jQuery是一個JS庫,冒出「我不是在編寫Javascript代碼」,而是在編寫「jQury代碼」的愚蠢想法。
從長遠來看,過度依賴於jQuery並不是件好事。但jQuery已侵蝕Web設計師的身心。說的誇張點,即使你不懂Javascript,你也可以學會jQuery的大部份使用。即使你不懂jQuery,你也可以使用它的無數插件創造出炫目的網頁特效。
本文為你介紹30+最新強大jQuery插件和教程,在這之前,讓我們之前本站發佈的相關的jQury插件和教程文章:
- 14條改善jQuery代碼的技巧
- 13個增強Web設計界面的Javascript腳本
- 15款jQuery幻燈片插件
- 30+ jQuery中文教程和資源
- 6款jQuery圖表插件
- Easy Slider: 功能強大簡單易用的jQuery滑動門插件
- 3款基於jQuery的Twitter插件
更多請查看jQuery專欄。
教程
1. How to add preloader with loading image in a gallery using jQuery
在圖像畫廊載入過程中使用 jQuery 預加載技術。演示 | 教程
2. Simple Lava Lamp Menu Tutorial With jQuery
創建一個獨特的熔岩燈動畫效果的 jQuery 導航菜單。演示 | 教程
3. How To Create a 3D Tag Cloud in jQuery
使用 jQuery 創建類似 Flash 形式的 3D 標籤雲。演示 | 教程
Web 應用程序的拖放功能提供了豐富的用戶界面,瞭解如何使用 jQuery 來創建此種用戶界面。演示 | 教程
5. Awesome Horizontal Animated menu using Kwicks for jQuery
使用 jQuery Kwicks 插件建立一個可定製的,靈活的橫向動畫菜單。演示 | 教程
6. Create a Thumbnail Gallery With Slick Heading & Caption effect
7. Create an Attractive jQuery Menu with fade in and out effects
創建一個有吸引力的 jQuery 菜單,鼠標懸停時具有淡入背景效果。演示 | 教程
8. jQuery PHP AJAX Autosuggest
Autosuggest 是目前的 Web 應用程序中一個有用的功能。瞭解如何使用 jQuery 和 PHP 來創建。(...)
繼續閱讀 30+最新強大jQuery插件和教程
轉載請註明: 來源於 30+最新強大jQuery插件和教程
原訂閱地址即將失效,請大家更換到新的訂閱地址: http://feed.paranimage.com/
© 帕蘭 for 帕蘭映像, 2010 |
添加到 del.icio.us
通過這些關鍵詞: jquery, jQuery插件, jQuery教程 找到更多你可能喜歡的內容
第5工作室 - 付費設計: 自定義個性化網頁設計, 承接付費WordPress主題定製, PSD轉XHTML等設計業務.
第7網賺室 - 在線賺錢: 向你推薦最熱門最真實的在線賺錢途徑, 讓你在寫博同時, 輕鬆賺取美元!
第9主機室 - 國外主機: 低於5美元/每月, 支持PayPal付款的美國虛擬主機, 直觀圖析評測導購, 幫您做出明智的選擇.
CSS Sprites 產生器,改造網頁以加快圖示載入速度
一般在做網頁時,都會加入許多圖示來讓整體網頁看起來更為活潑,不過你可能不知道,當一個頁面裡圖示越多,使用者就必須花更多時間來讀取這些零散的圖示,但透過CSS Sprites這項技術,可以幫你把所有圖示合併成一張大圖,在以CSS的定位方式來讓某圖示出現。
CSS Sprites Generator是一個幫你把圖片組合起來的網站工具,除了幫你組合起來之外,還會幫你算好位置並且顯示出來,讓你不必自己辛苦計算位置,因為CSS Sprites Generator會幫你搞定。
在介紹之前先來展示一個範例,讓大家瞭解這個功能到底是做什麼的,首先拿Yahoo!奇摩的網站來給大家看看背景圖。
▲ 圖中紅色框部分的圖示其實都是同一張圖片,當然不只這些...還有更多。
詳細請見:http://l.yimg.com/f/i/tw/hp/spirit/sprite_icos_090507.png
其實Google的首頁也有用CSS Sprite,只是數量上比較沒那麼明顯,使用CSS Sprite的目的是為了提升網頁頁面讀取的速度,可以有效降低圖片的HTTP請求數,尤其是你的網站有很多小圖示或圖片時,一張張上傳也很麻煩。
使用教學
CSS Sprites Generator的頁面大致上非常簡單易懂,最初會有三個,如果不夠可以點 'Need More »' (每次增加三個)將你的圖片加進去,在點 Generate。
上傳完成後,會出現合併完成的 PNG 檔以及範例頁面,下方也會有詳細的 CSS 設定教學,告訴你要設定多少的 background-position
才能讓該圖示顯示出來。
補充 …
CSS Sprite Generator | Project Fondue - http://spritegen.website-performance.org/ (可用壓縮檔)
這是類似的網頁服務,可以用壓縮檔的形式上傳比較大量的圖片,就不另外做介紹。
相關文章:
- Strong Password Generator
- The Minifig Generator - 樂高人物線上產生器
- E-Mail Icon Generator - 將信箱改為圖片顯示,有效防止垃圾信攻擊。
- Password Bird - 用密碼鳥產生你的隨機密碼!
- Web20Generator - 線上產生符合 XHTML 標準語法的 Web2.0 網站!
如需閱讀本文章,請至 http://www.freegroup.org/ 或查詢免費資源網路社群原始文章(http://www.freegroup.org/2010/02/css-sprites-generator/)。
本文章僅供免費電子發佈使用,如需印刷許可,請提出申請。轉載時必須附上原文章連結,謝謝。 "
使用Google翻譯工具,讓使用者能以多種語言閱讀你的網站
以往我會在部落格里放上一些常用的語言翻譯功能,例如SWeTE能建立多國語言網站,讓其他國家的使用者也可以使用他們的語言來閱讀網站內容,雖然很方便,但要每種語言都加入似乎又太浪費時間。透過Google翻譯提供的「工具與資源」,只要在網站或部落格里加入一段程式碼,就能自動辨識讀者來自哪個國家,並在適當時機顯示出翻譯提示。
進入Google翻譯,點選左側的「工具與資源」。
接著選取你網站的語言,例如中文(繁體),下方的選擇譯文語言可以讓你自訂要翻譯成哪些語系,預設是所有語言,不用進行其他設定。
如果選擇指定語言,就必須勾選要翻譯的語言囉!
完成後把下方的程式碼複製起來,然後貼到要呈現的網頁或部落格位置上就可以啦!例如側邊欄是個不錯的選擇,可以讓讀者在閱讀文章時很容易找到翻譯工具。
其實只要裝了Google翻譯工具後,進入網頁時就會自動提示要翻譯的語言了,你可以在下方網址進行測試:http://translate.google.com/support/#googtrans(en|zh-TW)
可以看到頂端會出現提示翻譯的相關說明,相當好用。快點幫自己的網站裝上多國語言的功能吧!
Link: http://translate.google.com.tw/translate_tools
相關文章:
- Translate.ru
- TranslateThis 即時網站翻譯工具(支援52種語言)
- Google Dance Tool
- Google 登錄頁面
- BinGoo! 4個可以同時搜尋Google和Bing的搜尋引擎!
如需閱讀本文章,請至 http://www.freegroup.org/ 或查詢免費資源網路社群原始文章(http://www.freegroup.org/2010/02/google-translate-tools/)。
本文章僅供免費電子發佈使用,如需印刷許可,請提出申請。轉載時必須附上原文章連結,謝謝。 "
為網站加入Sharebar,讓訪客能快速分享及轉寄文章!
最近很流行類似Meebo Bar或是Wibiya的部落格應用,只要加入幾行語法,就能夠在網站的下方顯示工具列,無論是搜尋文章、翻譯、查看線上人數、分享轉寄文章,或是結合Twitter、Facebook都非常簡單。號稱全世界第一名書籤&分享服務的AddThis也推出工具列服務,整合了分享按鈕的工具列目前仍在測試階段,相當好用喔!
你可以在免費資源網路社群看到Demo,或是在這裡找到更多資訊。
如何使用Sharebar?
Sharebar目前仍在測試階段,只要將以下原始碼加入網站、部落格的 </body> 標籤前就能夠顯示出工具列。
<script src="http://sharebar.addthiscdn.com/v1/sharebar.js" type="text/javascript"></script>
如果你想要自訂一些參數,可以參考說明文件,有蠻完整的介紹及說明,但可以自訂的項目還不是很多(也無法自訂語系)。Sharebar的功能部分還有待加強,目前只有搜尋和加入書籤、分享的功能,AddThis會在收集使用者提供的意見,逐步改進Sharebar的功能,且讓我們拭目以待吧!
Link: http://www.addthis.com/labs/sharebar
相關文章:
如需閱讀本文章,請至 http://www.freegroup.org/ 或查詢免費資源網路社群原始文章(http://www.freegroup.org/2010/02/addthis-sharebar/)。
本文章僅供免費電子發佈使用,如需印刷許可,請提出申請。轉載時必須附上原文章連結,謝謝。 "
7個神奇的jQuery 3D插件
7個神奇的jquery 3D插件,讓你可以實現一些媲美Flash的動畫特效。
1. Flip HTML content in 3D
用jQuery實現的3D翻轉效果,支持html內容的翻轉。
2. Agile Carousel
3D效果的jQuery跑馬燈特效。
3. Rotation
jQuery旋轉3D特效。
4. Tag Cloud
使用jQuery創建的3D標籤雲。(...)
繼續閱讀 7個神奇的jQuery 3D插件
轉載請註明: 來源於 7個神奇的jQuery 3D插件
原訂閱地址即將失效,請大家更換到新的訂閱地址: http://feed.paranimage.com/
© 帕蘭 for 帕蘭映像, 2010 |
添加到 del.icio.us
通過這些關鍵詞: jquery, jQuery插件, jQuery教程 找到更多你可能喜歡的內容
第5工作室 - 付費設計: 自定義個性化網頁設計, 承接付費WordPress主題定製, PSD轉XHTML等設計業務.
第7網賺室 - 在線賺錢: 向你推薦最熱門最真實的在線賺錢途徑, 讓你在寫博同時, 輕鬆賺取美元!
第9主機室 - 國外主機: 低於5美元/每月, 支持PayPal付款的美國虛擬主機, 直觀圖析評測導購, 幫您做出明智的選擇.
使用 PHP GZIP 使網頁提速
安裝eAccelerator
eAccelerator是套讓php程式加速的軟體
安裝環境:
CentOS release 4.4 (Final) 64位元
Apache 2.0 Handler
PHP Version 4.3.9
由於之前安裝CentOS時,並未選擇全部安裝,系統裡缺少一些必要套件,所以在安裝時會出現一些錯誤,不過在yum install後皆可順利安裝好所需套件。
跨瀏覽器 CSS3 代碼生成器
可憐天下 web developers 不知花了多少光陰在支援不同瀏覽器上。Internet Explorer 就甭提了,即使 Safari、Firefox 都支持的陰影(box-shadow)效果,偏偏都有不同寫法。結果就是同一件事情要寫好幾次,不幸要修改數值的話又要連續改數次。杯具啊……(還是都習慣了?)
原本簡單一個陰影效果往往要六行 code 才可以搞定:
.box_shadow {
-moz-box-shadow: 1px 0px 4px #ffffff; /* FF3.5+ */
-webkit-box-shadow: 1px 0px 4px #ffffff; /* Saf3.0+, Chrome */
box-shadow: 1px 0px 4px #ffffff; /* Opera 10.5, IE 9.0 */
filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=1px, OffY=0px, Color='#ffffff'); /* IE6,IE7 */
-ms-filter:'progid:DXImageTransform.Microsoft.dropshadow(OffX=1px, OffY=0px, Color='#ffffff')'; /* IE8 */
}
為瞭解決這個問題,我在此隆重介紹~ CSS3 Please.com- 一個網上 跨瀏覽器 CSS3 代碼生成器。以後寫 CSS3,只需修改一處地方,網站自動幫你更新其他瀏覽器的代碼。支持的效果有圓角 border-radius、陰影 box-shadow、漸變、移動 transform等,而且還會最大限度地支援各個瀏覽器:Internet Explorer, Safari, Chrome, Firefox, Opera。比較意外的是,原來有不少效果在 Internet Explorer 下可以靠 filter (DXImageTransform) 來達成,如果要自己寫的話,大概要花不少時間查文檔吧。
"40 多個最佳化 PHP 的技巧
http://reinholdweber.com/?p=3
1. 如果一個方法可以是靜態的,就將它宣告為靜態,這樣子會提昇四倍的效率
2. echo 會比 print 快
3. 使用 echo 的多參數模式,取代使用字串連結運算子
例如: echo $arr1,$arr2,$arr3; 會比 echo $arr1 . $arr2 . $arr3; 來的快
4. 在 for 迴圈執行之前設定最大次數,而不是在迴圈執行過程中決定
例如:
for($i = 0; $i < 10; $i ++) {
echo 『test』, chr(10);
}
比這樣好:
for($i = 0; ; $i ++) {
echo 『test』, chr(10);
if($i == 10) break;
}
5. 移除變數(unset())來釋放記憶體,特別是大型陣列
6. 避免使用神奇方法,像是 __get, __set, __autoload
7. 避免使用 require_once()
也就是說,儘可能確認一個執行程序中,對於單一檔案只進行一次的引用
8. 透過 include 與 require 引用檔案時儘可能使用絕對(完整)路徑,減少處理作業系統路徑的時間
9. 如果想要知道程式開始執行的時間(例如在進行效能評估時), $_SERVER[』REQUEST_TIME』] 會比 time()正確
10. 儘可能試著用 strncasecmp()、 strpbrk() 與 stripos() 等函數取代樣式比對
11. str_replace 會比 preg_replace 來的快,而 strtr 比 str_replace 更快四倍
12. 如果有函式(例如字串替換函數)同時接受陣列與字串作為參數,而要使用的參數也不會太多,可以嘗試多寫幾行程式,每次處理一個字串,取代在一行程式中傳送陣列作為參數的形式
13. 使用 switch() 語法會比大量 if, else if 好
14. 透過錯誤抑制運算子 @ 會拖慢程式速度
15. 啟用 apache 的 mod_deflate
16. 在結束資料庫操作後將連線關閉
17. $row[』id』] 會比 $row[id] 快七倍
也就是說,清楚定義陣列的索引會比較好
18. 儘可能不要放任錯誤訊息存在
也就是說,不要刻意關掉系統對於錯誤訊息的提示來忽略錯誤訊息
19. 在 for 迴圈中,不要在開始的地方使用函數,例如 for ($x=0; $x <>
20. 在方法中使用局部變數比較快,跟在函數中使用一樣意思
也就是說,能夠用局部變數進行的工作,就不需要刻意產生一個物件屬性(var $foo;)、全域變數(global $foo;)
21. 增加一個全域變數會比局部變數慢兩倍
22. 增加一個物件屬性(例如: $this->prop++)會比局部變數慢三倍
23. 增加一個未事先定義的局部變數會比預先定義的形式慢 9~10 倍
24. 在函式中宣告一個用不到的全域變數會讓速度變慢(相對於增加同樣數量的局部變數),PHP 也許是增加了檢查全域變數存在與否的時間
25. 方法的執行效能似乎是獨立於物件中定義的數量,在測試物件中增加 10 個方法(在要測試的方法之前與之後)對於效能沒有任何影響
26. 在衍生的物件中執行的方法會比繼承而來的方法快
27. 執行帶有一個參數且沒有內容的函式,時間大約等於 7~8 次的 $localvar++ ,而透過物件方法進行類似的測試則約等於 15 次的 $localvar++ 時間。
28. 透過單引號使用字串會比雙引號快一些,因為 PHP 會在雙引號的字串中嘗試找尋有無變數
29. 似乎跟 3. 重複
30. 在 Apache 中,一個 PHP 程式比靜態的 HTML 頁面慢 2 ~ 10 倍,可以試著使用更多的靜態 HTML 取代 PHP 程式
31. PHP 程式會在每次執行時再次編譯,除非使用快取;安裝一個 PHP 快取程式基本上可以增加 25% ~ 100% 的效能,因為省去了編譯的時間
32. 儘可能使用快取,像是 memcached。memcached 是一個高效能的記憶體物件快取系統,透過減少資料庫存取來提昇動態網站應用程式,快取中間碼(OP code)讓程式不需要每次執行都進行編譯。
33. 需要檢查字串是否為指定長度時一般都會透過 strlen() ,這個函式很快,因為它不會執行運算,只是將 zval 結構(PHP 用來儲存變數的內部 C 語言結構)中已知長度傳回。不過因為 strlen() 是一個函式,執行函式的操作會有些程序,像是轉小寫與搜尋雜湊表,如果能夠,透過 isset() 會快上許多。
例如:
if (strlen($foo) < 5) { echo 「Foo is too short」; }
相對於
if (!isset($foo{5})) { echo 「Foo is too short」; }
執行 isset() 會比 strlen() 快一些,因為 isset() 是一個語言結構,而非函式,所以不需要進行轉小寫或搜尋雜湊表的程序,意味著檢驗字串的長度實際上不會造成額外的負擔
34. 增加或減少一個變數的數值時, $i++ 比 ++$i 慢一些,這個情況只有在 PHP 才會發生,因為 $i++ 使用了四個中間碼, ++$i 只要三個,後置增加語法實際上會產生一個暫存變數,而前置形式則是直接增加原本變數,這是一個用在 Zend』s PHP optimizer 的中間碼最佳化技巧。記住這個方法,因為並非所有最佳化引擎都會執行這個動作,而更有許多主機連最佳化程式都沒有安裝。
35. 並非所有東西都得物件導向,呼叫方法與物件需要大量的記憶體
36. 不要將所有資料結構都定義為物件,陣列也是很有用的
37. 不需要把方法切的太細,想清楚,哪些是真正會重複使用的
38. 在需要的時候,可以隨時進行方法的切割
39. 儘可能使用預先定義的函式(PHP預設的)
40. 如果有非常耗時間的函式,不妨將它寫成 C 語言的外掛
41. 探查程式碼的輪廓,一個輪廓探查工具可以顯示個別程式碼執行所需要的時間,而 Xdebug 除錯工具已經包含了這樣的功能,探查輪廓可以檢視整體效能瓶頸
42. Apache 的模組 mod_gzip 可以壓縮需要傳輸的資料,最多達 80%
43. John Lim 提供了另一篇 PHP 最佳化的文章:
http://phplens.com/lens/php-book/optimizing-debugging-php.php