Copy Code code as follows:
<nav class= "Cf_nav clearfix" >
<ul>
<li>
<a href= "http://lizhuangs.18021051d350c3871c0a.tpl.diandian.com" title= "Home" >
<div class= "Nav_block" >
<span> Home </span>
<span class= "hover" > Home </span>
</div>
</a>
</li>
<li>
<a href= "Http://lizhuangs.18021051d350c3871c0a.tpl.diandian.com/submit" title= "Submission" >
<div class= "Nav_block" >
<span> Contributions </span>
<span class= "Hover" > Submission </span>
</div>
</a>
</li>
<li>
<a href= "Http://lizhuangs.diandian.com/inbox" title= "DMS" >
<div class= "Nav_block" >
<span> DMS </span>
<span class= "hover" > DMS </span>
</div>
</a>
</li>
<li>
<a href= "http://lizhuangs.18021051d350c3871c0a.tpl.diandian.com/archive" title= "Archive" >
<div class= "Nav_block" >
<span> Archive </span>
<span class= "hover" > Archive </span>
</div>
</a>
</li>
<li>
<a href= "Http://lizhuangs.18021051d350c3871c0a.tpl.diandian.com/rss" title= "subscribe" >
<div class= "Nav_block" >
<span> Subscriptions </span>
<span class= "hover" > Subscription </span>
</div>
</a>
</li>
If I'm limiting the characters in the span above.
$ ("Nav_block span"). Wordlimit (8);
It uses the following method to define the jquery plug-in, which I have deducted from the DOT network:
Copy Code code as follows:
Copyright C by Zhangxinxu v1.0 2009-09-05
Http://www.zhangxinxu.com
/* $ (". Test1"). Wordlimit (); Automatically gets the CSS width to process, if the CSS does not have the width given in the. Test1, it does not work
$ (". Test2"). Wordlimit (24); Intercepts the number of characters, which is an integer greater than 0, where the number of characters in a label with class Test2 is up to 24
*/
(function ($) {
$.fn.wordlimit = function (num) {
This.each (function () {
if (!num) {
var copythis = $ (This.clonenode (true)). Hide (). css ({
' Position ': ' absolute ',
' Width ': ' Auto ',
' Overflow ': ' Visible '
});
$ (this). After (Copythis);
if (Copythis.width () >$ (this). Width ()) {
$ (this). Text ($ (a). Text (). SUBSTRING (0,$ (this). Text (). length-4));
$ (this). HTML ($ (this). html () + ' ... ');
Copythis.remove ();
$ (this). Wordlimit ();
}else{
Copythis.remove (); Clear replication
Return
}
}else{
var maxwidth=num;
if ($ (this). Text (). Length>maxwidth) {
$ (this). Text ($ (this). Text (). substring (0,maxwidth));
$ (this). HTML ($ (this). html () + ' ... ');
}
}
});
}
}) (JQuery);
