話說首頁有個文章列表，大家注意到了吧？好像是廢話。布局上馬馬虎虎過得去，不過細看，偶眼光比咱首都的車檢員差得遠，還是能發現有違背社會和諧之處：
各個文章的概要長度七零八落，看上去不太齊整。前幾天專案中也碰到這樣問題，而且要截的內容可能包含許多richtext。現在沒有乙個瀏覽器支援哪種樣式，可以將在超出範圍內容自動截斷並加省略號。我等追求完美之人，怎麼能乙個substring了之呢？不信邪，研究了大半天，還真搞出了點名堂。現在地皮好貴，文字也得蝸居，不過比較人性化一點，固定的容器顯示盡可能多的內容，超過了加省略號。這篇文章就想解決這麼點問題，跟不屑的朋友說聲sorry。
對於留下來的朋友, 也不廢話了，直接上**：先實現只擷取文字，不截斷標籤。
=function
(len) ).substr(
0, len);
for(
vari =0
; i
<
sections.length; i
++)
while(/
^>
]*>
/.test(sections[i]))
return
me;}
然後通過offsetheight判斷是否內容是否溢位。一般情況是乙個固定高度div做容器，設定了overflow:hidden。有標題有內容，標題可能兩行。
function
truncatecontent(sh) ;
vardivtitle =$(
'divtitle')
;if(divtitle.offsetheight
>
25) sh
-=13;
if(divdes.offsetheight
<
sh)
return
;var
len
=gettextlength();
varellipsis ="
......";
vardes
=divdes.innerhtml;
while
(divdes.offsetheight
>
sh)
varstep
=100
, n =20
;while
(step
>1)
step
=parseint(step /2
);while
(divdes.offsetheight
>
sh)
step
=parseint(step /2
);}des
=divdes.innerhtml.substr(
0, divdes.innerhtml.length
-ellipsis.length);
divdes.innerhtml
=des.substr(0,
des.lastindexof(""
)) +
ellipsis;}
好像挺麻煩的，沒辦法，呼喚html 5趕緊推廣吧。
這是效果：
昨天朋友（也是程式設計師）跟我說工作整天重複勞動沒意思，又學不到東西。可是據我所見，到處都有可學的東西，這一點東西都要研究這麼久。雖然本身價值可能有限（subtext函式應該是比較有用的，還可以.net後台實現），但至少鍛鍊了正則替換和演算法，這是copy多少**也掙不來滴。
HTML5建立乙個徑向 圓漸變
html5建立乙個徑向 圓漸變 1 設計原始碼 2 實現結果 3 原始碼說明 1 找到ca nvas元素 var canvas document.getelementbyid canvas 2 建立context元素 var ctx canvas.getcontext 2d 3 建立乙個徑向 圓漸變...
HTML5建立乙個徑向 圓漸變
html5建立乙個徑向 圓漸變 1 設計原始碼 2 實現結果 3 原始碼說明 1 找到ca nvas元素 var canvas document.getelementbyid canvas 2 建立context元素 var ctx canvas.getcontext 2d 3 建立乙個徑向 圓漸變...
分享3乙個部落格HTML5模板
1.材類別 半透明 部落格html模板 個人部落格 半透明html5部落格主題,半透明,部落格,部落格html模板,個人部落格,html5,灰色,半透明html5部落格主題是一款適合用於個人部落格主題,風格非常不錯.半透明html5部落格主題 2.素材類別 暗藍色 部落格html模板 部落格 ui設...