ITseer - 資訊知識分享 | 程式技術討論: 2012

2012年9月1日

怎麼看 MAC OS X 是 32 位元還是 64 位元？

開啟終端機，輸入以下指令：

ioreg -l -p IODeviceTree | grep firmware-abi

若為 EFI32 就是 32 位元， EFI64 就是 64 位元。

jQuery - scroll to bottom

讓卷軸自動捲到最底下的方法：


var $element = jQuery('#myElement');
$element.animate({
    scrollTop: $element[0].scrollHeight
}, 300);

2012年8月28日

環境：
asp.net、.NET4.0、IE9

問題：
使用 ReportViewer 在 IE9 瀏覽時，報表內的表格欄寬，不會依照設計時所設定的寬度顯示

原因：
檢視 ReportViewer 所產生的 iframe 內，發現有一 <td width="100%" height="0/">，在某些瀏覽器下，該 <td> 會占據大量版面，導致原有的報表表格受到擠壓。

解決：
在網頁內加上 CSS 讓該 <td> 無效

<style type="text/css">

td[id*='oReportCell'] {width:100%; !important;}
</style>

並在 ReportViewer 屬性加上 AsyncRendering="false" 使 iframe 套用外層的 CSS 屬性

範例：
<rsweb:ReportViewer ID="ReportViewer1" runat="server" Font-Names="Verdana"

Font-Size="8pt" Height="0px" ProcessingMode="Remote" Width="100%" AsyncRendering="false">
</rsweb:ReportViewer>

本文章參考：
http://faultbucket.ca/2011/10/reportviewer-doesnt-take-full-width-in-internet-explorer/

2012年8月21日

Cupoy Chrome 擴充工具介紹

鄉民們大家好，在PTT註冊這麼久，其實一直以來不是很希望po這種像是老王賣瓜一樣的文章，不過，這是目前在下所任職公司針對Google Chrome所開發出來的擴充工具，而且這個服務我自己也覺得很不錯僅用這篇文章來像大家介紹這個擴充工具，希望大家能不吝指教，謝謝！

什麼是Cupoy？

Cupoy是一個讓你方便收藏逛網站過程中看到的一切事物的好工具，除了收藏以外，也能夠讓你彙整出一本又一本的主題雜誌，分享給他人最後的成品，會長成這樣子：

2012年8月19日

VirtualBox 架設 SERVER (使用 Port Forwarding方法)

假設虛擬機名稱為 XP2

先將虛擬機器『完整關機』，非儲存狀態。

進入VirtualBox管理員，XP2→設定值→網路→介面卡1，勾選【啟用網路卡】，設定【附加到】為 "NAT" (如下圖)。

2012年8月15日

Cupoy - 社群主題雜誌服務介紹

社群洪災 (Social flood)

隨著行動裝置與社群網路逐漸的在生活普及，人們能利用生活中的各種空檔(如搭車、吃飯)與好友們分享生活中的各種資訊，然而，當資訊傳遞方式逐漸被拆解成單張照片、微網誌、微電影、打卡；使用者所創作出的內容也跟著被拆解成許多的碎片。

很多人可能都遇過這樣的狀況，在網路上看到朋友分享了某個有趣或特別的連結或圖片，但在幾天後想再看的時候，卻完全不記得當時是哪個朋友分享了，因為它早已被大量新的訊息所淹沒了，儘管只記得內容片段或關於內容模模糊糊的印象，也不知道該怎麼從這茫茫的訊息中找回到原來的訊息。

這個時候該怎麼辦呢？ Google是常用的方法，但如果你想找的內容不在Google的排名裡面，那恐怕就沒輒了。

2012年8月12日

ASP.NET Report Viewer 無限 "正在載入" 問題

環境：

asp.net、C#、.NET4.0、VS2010

問題：

在 Page_Load() 執行設定 ReportViewer相關操作，導致網頁瀏覽時ReportViewer一直出現"正在載入..."不會停止(如下圖)。

解決：

判斷是否 PostBack

if(!IsPostBack)

{

//抓取db資料 ...

//設定ReportViewer ...

ReportViewer1.LocalReport.DataSources.Add(rds);

// ....

}

2012年6月18日

jQuery noty plugin 美麗的對話提示

簡介

jQuery noty是一款輕量級的jQuery alert差件，它讓我們能夠非常簡單的創造alert對話框，例如成功、失敗、資訊、確認視窗等，不僅如此，每一個alert任務都會被放入等待對列中，等到前一個結束接下去的那個會一個個的觸發。noty的提示可以容易的設定出現位置，有左上、中上、右上、中間、右下等....不僅如此notyc還提供許多相當多的參數只需要在呼叫時加入即可馬上操作。

2012年6月17日

SEO優化 - rel="nofollow"使用方式

前言

在SEO中，有許多的優化技巧，例如關鍵字優化、內容代碼比、標題優化，而『交換連結』是一個很有用的優化管道，交換連結是甚麼呢?可以簡單的這樣說明，假如A網站中有一個來自B網頁的反向的連結，搜尋引擎就會認為"B網頁投了A網頁一票"，但是要注意一點，即使B網站投A網站一票這並不代表對A網站是一件好事，如果B網站是一個被K的網站(信用不好、作弊等)，那麼A網站相對的可能也會遭到降等，那麼要如何避免這種事情發生呢?就是使用rel=nofollow!

2012年6月16日

使用RSS Graffiti自動發表部落格文章到Facebook上

前言

最近ITseer有發表新文章時都會透過Facebook粉絲團通知大家，但是有時候又怕自己有點懶忘記PO文娜該怎麼辦呢?現在解決辦法出來囉，RSS Graffiti是Facebook上的一個應用程式，它提供使用者定期的發表RSS/Feed訊息到塗鴉牆上的功能，廢話不多說，趕快來看看怎麼使用

SEO - Blogger 自訂文章網址

前言

好的SEO不僅是網站標題、關鍵字、內容代碼比、交換連結、以及Meta標籤優化，還有一項也被納入考量的因子，那就是網頁的網址，本篇將以Blogger為例，教大家如何設定文章的網址。

SEO優化 - 網站標題優化

前言

網站SEO的優化技巧實在有非常多樣，其中包誇了之前提到的關鍵字優化、內容代碼比、以及網域名稱、網址名稱，而今我們要探討的是如優化網站的標題，達到最佳的SEO效果，廢話不多說，開始今天的旅程吧!

CSS :first-letter 首字放大

前言

現實身活上許多報章雜誌的文章的排版都十分的講究，讓我常常著迷於這些設計上。今天在網上偶遇了愛貝客這個網站，他的設計以及排版十分的吸引我，裏頭不僅使用了許多CSS3的技術，還使用了前幾日提到的瀑布流排版，不過這不是今天的重點，吸引我的是它在文章開頭使用的首字放大效果，廢話不多說!開始今天的旅程~

2012年6月14日

jQuery customize event binding

前言

許多時候我們需要自己定義事件並監聽它，本篇將以jQuery提供的方法實作客製化(customize)的事件(event)，學會自己建立事件，是建立一個大型應用的基礎。

其他與建立/監聽事件相關的文章

SEO優化 - 內容代碼比

前言

最近ITseer正在做SEO的優化，因此筆者希望將這一系列的改良寫成文章與大家分享，在
這一系列的文章中也會帶來實際的改善紀錄。這次主要改良的是『內容代碼比』，什麼是內容代碼比呢?內容代碼比就是HTML程式碼與實際內容的比值，這跟SEO又有甚麼關係呢，讓我們趕緊接下去看看吧!!

2012年6月12日

SEO優化 - 關鍵字優化技巧

前言

搜尋引擎在現代已經發展的十分完整，當我們遇到一些問題或是想找一些有趣的事物時，常常我們會到Google,yahoo,bing等搜尋網站輸入需求，這個輸入的詞彙也就是所謂的『關鍵字』，一個好的關鍵字可以讓我們找到正確及想要的內容，而以網站經營者的角度來看，如何設計一個好的網站關鍵字將是一個足以影響整網站營運、收益的重要因素。

2012年6月6日

jQuery when 使用方法

前言

幾乎現代的網頁都以ajax作為主要的設計方式，過去的form表單元素使用的機會越來越少，使用『非同步』ajax帶給我們許許多多的好處，例如傳送一個請求(request)到伺服器我們不需要像過去乖乖地等待回應(response)，因為它會在背後執行，當它完成時會自己呼叫callback函數，這樣更帶來了更好的用戶體驗。

2012年6月3日

JavaScript 取得選取的文字、HTML

前言

剛剛在使用Chrome的字典插件突然看到一個簡單的功能，但卻又不知道怎麼實作，就是框選網頁並取得框選中的資料內容，就找了一些資料完成了這篇簡短的文章囉，廢話不多說，直接補上這段程式碼給大家參考。

監聽Iframe onload事件

前言

在Web2.0這個時代上，許許多多的網站應用都內嵌(iframe)了許多第三方的內容在自己的網站上，剛好最近專案上也在處理一些Iframe相關的問題就做了一些筆記，今天要解決的問題是如何偵測網頁上Iframe載入完成(onload)的事件，提出的解決方法有兩種，分別為jQuery方法與純javascript方法。

2012年5月31日

Single Page Application 實作 - 使用hash change event

前言

在上一篇文章『監聽 hash change 事件方法』中簡單的提到我們該如何監聽網址的Hash值改變，在本文章中我們將會利用這項技術，實際完成Single Page Application(SPA)的基本架構，有著這樣的架構，我們就能夠使用ajax的方式更新畫面，而不需要將整個畫面重新載入。

監聽 hash change 事件方法

前言

首先來說明為什麼要去監聽hash改變這個動機好了，現在有許多的應用都取向於單一頁面而不是過去的多個頁面，好處有很多，最明顯的好處就是只需要使用ajax的方式去改變要改變的區塊就好，不用整個page重新reload，最經典的例子就是gmail;如果要實作這樣的功能做常見的方式就是透過改變window.location.hash這個屬性來達成，瀏覽器hash屬性改變時並不會讓當前的頁面去reload，我們定義不同的hash位址定位不同的功能頁面，例如

www.itseer.com/#main : 首頁

www.itseer.com/#contact : 聯絡頁面

www.itseer.com/#author : 作者頁面

藉由監聽hash值得改變，動態的去載入或更換畫面需要update的部分。

方法一 : 使用javascript onhashchange事件

我們可以對window的onhashchange綁定事件，但是onhashchange事件在ie7 ie9雖然存在，但是這個事件卻不會被觸發，所以需要對ie瀏覽器使用不同的解法，這邊的提供解法是每100毫秒檢查一次hash是否有沒有改變，若改變就觸發要做的事情，這樣有點浪費效能的嫌疑。

CSS text-indent 與 word-spacing 介紹

簡介

本文章簡單的介紹CSS中的兩個在文章排版非常有用的屬性，分別為text-indent(縮進)、word-spacing(字距)。

text-indent

相信大家小時候或是現在都有寫過作文，而作文在文章的最前頭都必須要縮進二~四格空白，在網頁中，你可以使用text-indent來實作這個功能

2012年5月30日

跨域請求- JSONP 使用jQuery實作

甚麼是JSONP

The script tag method for cross-domain data fetching: JSON with Padding, or simply JSONP. - Bob Ippolito

JSONP也就是JSON with Padding，意思就是讓JSON資料添加了一些添加物(也就是function name)，主要用來解決跨域資源存取的問題，用JSONP抓到的資料並不是JSON，而是一段javascript function並包含了JSON資料的程式碼，瀏覽器在取得後不是使用JSON解析器而使用JavaScript執譯器執行並得到結果。

跨域請求 (cross domain ajax)

簡介

本文章主要探討前端發出跨域(cross domain)的請求(request)的解法，瀏覽器基於安全性的原因，禁止javascript發出跨域的Request，在深入探討之前必須先解釋何謂跨域(cross domain)。

跨域

domain指的是網站的所在地址代稱，每個網站伺服器都會有一個IP，但這組地址實在不好記，因此DNS伺服器會幫助我們將一個容易記得的名稱(domain name)對應到我們伺服器的IP。跨域(cross domain)指的就是請求在其他的domain地址，而不是本身伺服器位置。例如www.a.com發出request至www.b.com這就是跨域的行為。

瀑布流(Waterfall)排版研究

如果你看過或用過Pinterest這個全球第三大的社交網站，那你一定對瀑布流(WaterFall)排版不陌生，使用這種參差不齊的排版方式來展現源源不絕的產品、圖片是一個非常棒的作法，為什麼呢?

`如果你不了解Pinterest，可以參考Inside Harlequin的文章`

好處一 : 最大面積的利用螢幕空間

好處二 : 最大範圍的搜尋

2012年5月17日

養眼網站 | Fab - 創意產品社交交易平台

今晚在科技橘子上的這篇文章中發現了Fab這個社群創意作品交易網站，介面明亮顯眼，我大概在裡面探索了十多分鐘，發現它的使用者體驗做的也不賴，其中還包含了pinterest瀑布流呈現以及許多方便又時尚的介面。

我把一些重點截圖起來大家一起參考學習

Bundlr － Grid背景效果不錯的網站

今天在逛網站的時候無意間發現這個網站
http://bundlr.com/

這個網站下方的方格框框的背景效果十分的有FU，看起來就像是有很多資料在裡面

觀察其實作方式並非使用圖片作為背景，而是使用css的旋轉模擬出來的。

後來點擊內中的連結進入這個網站

http://bundlr.com/b/creative-photography

它的圖片Layout也相當的美觀。

UI Reference & Learning

2012年5月5日

jQuery 快速鍵 plugin

簡介

jQuery Hotkeys 是一款讓你能夠輕鬆設定鍵盤按鍵的插件，使用它你可能很簡單的新增/移除鍵盤事件，而且它幾乎支援所有的鍵盤按鍵組合(key combination)。

2012年5月1日

SEO優化 - H1標籤使用時機

一般標題

我是文章內容我是連結我是文章內容

文章內副標題

我是文章內容我是連結我是文章內容

吃橘子囉！文章輕薄短小，吸收科技新知沒負擔，一起來看看今天在 TechOrange 上最受讀者們歡迎的 TOP5 文章吧！

非數字列表

非數字列表
非數字列表

數字列表

非數字列表
非數字列表

顏色非數字列表

非數字列表
非數字列表

顏色數字列表

非數字列表
非數字列表


var code = "";

2012年4月29日

jQuery naturalWidth naturalHeight 取得原始的大小

簡介

這篇文章主要為作者碰到的一個問題，相信大家都使用過jQuery提供的width及height方法，但是這個方法所取得的大小並非原始的尺寸，那該如何取得正確的尺寸呢??

解決方式

其實jQuery並沒有提供這樣的方法，但是我們可以透過javascript的方式取得，使用方式很簡單，在javascript中每個DOMElement都有naturalWidth及naturalHeight兩個屬性，所以如果要使用jQuery取得這個值就直接使用get或[0]將jQuery物件轉回javascript物件在取得該屬性即可，程式碼如下。


    var naturalWidth = $("#my_id")[0].naturalWidth;
    var naturalHeight = $("#my_id")[0].naturalHeight;

後記

其實你喜歡的話你也可以將這個寫成jQuery的函式(jQuery.fu.yourMethod)，但這個實在是太簡單了所以作者就沒有將它而外寫成Plugin囉。

2012年4月20日

OpenCV灰階化－使用cvCvtcolor

簡介：
灰階化，是影像處理過程中不可或缺的一部分，很多時候都會用來做為前處理的一部分，那麼我們來看看，在openCV中要如何使用內建的工具來完成呢？

2012年4月15日

網頁設計流行趨勢

網頁設計流行趨勢

作者：Espen Brunborg   翻譯：雷皓漪

原文：http://uxdesign.smashingmagazine.com/2012/03/15/symptoms-of-epidemic-web-design-trends/

    自從Elliot Jay Stocks 嚴肅地告誡我們應該摒棄web2.0的外觀，我們看到了互聯網的巨大改變。互聯網上不再有那麼多水晶按鈕、斜面的邊緣、反射效果、特價徽章、著色鮮豔而粗糙的斜面、斜線的背景版式等。除了那些光滑設計狂熱愛好者，這種轉變已經被大部分人所接受。可是，如果設計和美學照這樣的非常態發展，不久後在另一個趨勢產生之前，這個網頁設計趨勢便會消失。

流行
    那麼，究竟什麼是當下的流行呢？讓我們一起來看看一些最常見的流行跡象吧。流行不難被發現，因為它們通常需要其他事物共同出現來襯托。（這也就是為什麼傳染會如何高效——當和其他物體結合之後，那些看起來獨立的症狀變得更有傳染性。）

      注意：下面的列表並沒有按特定的順序排列，也不代表影響程度，因為它們看起來都差不多。同時注意以下引用的每個例子包含不只一種流行跡象，因為要把它們嚴格分類幾乎是不可能的。

針線效果
    針線手法的出現，通常是因為設計師太多地注重邊框和線，特別是點狀物的多樣性。從點到破折線的微小轉變就表現了一個完整的針型，加上陰影和其他效果使它又有了3D的效果。
      在網頁設計中使用針形的確切目的只可意會不可言傳，但它在一些特定材質的環境下經常得到使用。比較典型的是在織物皮革材質，或是為了營造真實的顆粒感的情況下。我們很難說出針形效果的靈感是從哪裡來的，但是科學家們相信它的產生是過度使用「Skeuomorphism」的結果。

從左上順時針排列分別為: The Journal of Min Tran; Dribbble shot by Mason Yarnell; Dribbble shot by Liam McCabe.
`本文單純分享，摘錄視覺中國網站，如果要更詳細的文章請觀看原文章 http://c.chinavisual.com/2012/04/09/c81551/index.shtml`

JavaScript true/false 傻傻分不清楚

JavaScript true/false 傻傻分不清楚

簡介

因該不少剛學JavaScript初學者常常會碰到這個問題，那就是我的if判斷甚麼時候會是true甚麼時候會是false，或著常常看到別人寫的if裡面沒有放置特別的判斷直接if(obj)這到底是甚麼意思呀，看到這些寫法真的會讓初學的人傻傻分不清楚啊!!

本篇就以這些問題為開始，帶領各位了解if判斷背後的秘辛，廢話不多說我們開始今天的旅程吧。

小技巧

在開始旅程之前，先介紹一個小技巧可以把任何值轉換成true或false，這個方法背後等同於if()裡面的轉換，相信大家都用過!這個符號來反轉true/false，例如if(!a == 520)，那大家試過兩個!符號嗎?有人說兩個符號不就等於甚麼都沒做!???

先賣個關子，在這邊你只需要知道!!(物件)會回傳true或false，最簡單應用就是可以把物件轉換的true/false值存到自訂變數中，如下


var value =!!null;   // value = false

實例

以下幾個例子你認為誰會是true誰會是false呢?


var q1 = undefined;
var q2 = null;
var q3 = [];
var q4 = {};
var q5 = 0;
var q6 = 1;
var q7 = 999;
var q8 = "";
var q9 = "hello";
var q10 = false;
var q11 = true;
var q12 = new Boolean("true");
var q13 = new Boolean("false");
var q14 = new Number(0);
var q15 = new Number(1);


var a1 = !!q1;
var a2 = !!q2;
var a3 = !!q3;
var a4 = !!q4;
var a5 = !!q5;
var a6 = !!q6;
var a7 = !!q7;
var a8 = !!q8;
var a9 = !!q9;
var a10 = !!q10;
var a11 = !!q11;
var a12 = !!q12;
var a13 = !!q13;
var a14 = !!q14;
var a15 = !!q15;

思考一下，並把答案寫在紙上
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

答案是


a1 = false
a2 = false
a3 = true
a4 = true
a5 = false
a6 = true
a7 = true
a8 = false
a9 = true
a10 = false
a11 = true
a12 = true
a13 = true
a14 = true
a15 = true

你答對了幾題呢!?

答對12題以上的朋友相信你對本篇文章要探討的已經相當了解，接下來要探討的可能你已經了解但你可以繼續閱讀下去，答對8題以下的朋友，接下來的文章你一定要繼續閱讀下去，好的不繼續廢話了，開始解釋囉

在JavaScript中，會等於false的值只會有undefined, null, false, 0, ""這五種，物件類永遠為true，為什麼?別問我規定就是人家訂好的嘛!!
ECMA官方規格說明

注意我剛剛說得，就只有上面幾種值會是false，那我們再一次掃描每一題題目吧
q1 = undefined; 屬五大false類,為false
q2 = null; 屬五大false類,為false
q3 = []; []是一個空陣列，陣列是物件永遠為true
q4 = {}; {}空的物件還是物件，true
q5 = 0; 屬五大false類,為false
q6 = 1; 不屬五大false類,為true
q7 = 990; 同上
q8 = ""; 空字串屬五大false類,為false
q9 = "hello"; 不屬五大false類,為true
q10 = false; 廢話請別懷疑這題送分題
q11 = true; 廢話請別懷疑這題送分題
q12 = new Boolean("true"); 連下一題一起看
q13 = new Boolean("false"); Boolean為object永遠為true
q14 = new Number(0);
q15 = new Number(1); Number類同屬object永遠為true

注意q12~q15，你不是說0跟false是false嗎，怎麼q13,q15答案為true，那是因為使用new方式創建出來的Boolean, Number它們都是Object子類，使用typeof判斷都是"object"，而0, false使用typeof得到的結果分別是"number", "boolean"。


typeof 0; // "number"
typeof false; // "number"
typeof new Boolean("false"); // "object"
typeof new Number(0); // "object"

總結

歸納上面說明的，整理出這個表格

Input Type	Result
Undefined	false
Null	false
Boolean	The result equals the input argument (no conversion).
Number	The result is false if the argument is +0, -0, or NaN; otherwise the result is true.
String	The result is false if the argument is the empty string (its length is zero); otherwise the result is true.
Object	true

本篇文章就探討到這邊，如果有任何的問題歡迎留言討論。

jQuery prevUntil nextUntil parentUntil 使用方法

jQuery prevUntil nextUntil parentsUntil
使用方法

簡介

jQuery提供許多用來遍歷DOM元素的方法，其中用來找尋兄弟元素及父親元素，今天要介紹的是nextUntil,prevUntil,parentsUntil這幾個較不常用(誤><)的方法。

jQuery.fn.nextUntil

要使用這個方法首先你必須懂得使用next方法，這個方法是next的加強版，怎麼說呢，next方法只能取得目前節點後的一個元素，而nextUntil則是取得一組元素，這組元素大小取決於你給予的終止點。
簡單的說nextUntil讓你可以取得元素之後一直到終止點路上的所有的元素。

趕快來看個例子吧


<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <dl>
  <dt id="term-1">term 1</dt>
  <dd>definition 1-a</dd>
  <dd>definition 1-b</dd>
  <dd>definition 1-c</dd>
  <dd>definition 1-d</dd>

  <dt id="term-2">term 2</dt>
  <dd>definition 2-a</dd>
  <dd>definition 2-b</dd>
  <dd>definition 2-c</dd>

  <dt id="term-3">term 3</dt>
  <dd>definition 3-a</dd>
  <dd>definition 3-b</dd>
</dl>

</body>
</html>

執行nextUntil()


    $("#term-2").nextUntil().css("background-color", "#ff3333");

當nextUntil方法不放任何參數，我們會得到目標節點之後的所有元素。

執行nextUntil("selector")


    $("#term-2").nextUntil("#term-3").css("background-color", "#ff3333");

nextUntil方法的selector用來設定終止點，因此會取得一直到終止點路徑上的所有元素。

執行nextUntil(element)


    $("#term-2").nextUntil().css("background-color", "#ff3333");

在jQuery1.6版更新中，nextUntil也提供直接使用DOM Element元素當作終止點的方法，我們可以看到它的效果與selector
相似。

jQuery.fn.prevUntil

使用prevUntil的方式與nextUntil一模一樣，只是prevUntil是用來取得該節點之前一直到終止點路徑的所有元素，在這邊就不多做說明。

jQuery.fn.parentsUntil

使用parent()方法會取得該元素的父親節點，那如果要同時取得父親、祖父、曾祖父甚至曾....曾祖父時要怎麼實作呢?jQuery提供一個方法讓我們能夠輕鬆地做到這個功能，那就是parentsUntil，這邊要注意是parents不是parnet歐。

趕快來看這個範例吧


<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <dl>
  <dt id="term-1">term 1</dt>
  <dd>definition 1-a</dd>
  <dd>definition 1-b</dd>
  <dd>definition 1-c</dd>
  <dd>definition 1-d</dd>

  <dt id="term-2">term 2</dt>
  <dd>definition 2-a</dd>
  <dd>definition 2-b</dd>
  <dd>definition 2-c</dd>

  <dt id="term-3">term 3</dt>
  <dd>definition 3-a</dd>
  <dd>definition 3-b</dd>
</dl>

</body>
</html>

執行parentsUntil()


    $("#term-1").parentsUntil().css("border", '1px solid #ff6633')

執行parentsUntil("selector")


     $("#term-1").parentsUntil("body").css("border", '1px solid #ff6633')

今天介紹的這幾個方法筆者不知道甚麼請況使用最巧妙，如果你有好的idea請不吝告知。

參考資料

http://api.jquery.com/parentsUntil/
http://api.jquery.com/nextUntil/
http://api.jquery.com/prevUntil/

訂閱：文章 (Atom)

2012年9月1日

設定 meta 來解決 IE 版面跑掉問題

2012年8月28日

2012年8月21日

什麼是Cupoy？

2012年8月19日

假設虛擬機名稱為 XP2

2012年8月15日

社群洪災 (Social flood)

2012年8月12日

2012年6月18日

簡介

2012年6月17日

前言

2012年6月16日

前言

前言

前言

前言

2012年6月14日

前言

前言

2012年6月12日

前言

2012年6月6日

前言

2012年6月3日

前言

前言

2012年5月31日

前言

前言

方法一 : 使用javascript onhashchange事件

簡介

text-indent

2012年5月30日

甚麼是JSONP

簡介

跨域

2012年5月17日

2012年5月5日

簡介

2012年5月1日

一般標題

文章內副標題

非數字列表

數字列表

顏色非數字列表

顏色數字列表

2012年4月29日

簡介

解決方式

後記

2012年4月20日

2012年4月15日

簡介

小技巧

實例

總結

簡介

jQuery.fn.nextUntil

jQuery.fn.prevUntil

jQuery.fn.parentsUntil

參考資料

ShareThis