<nav class="cf_nav clearfix"> <ul> <li> <a href="首页"> <div class="nav_block"> <span>首页</span> <span class="hover">首页</span> </div> </a> </li> <li> <a href="投稿"> <div class="nav_block"> <span>投稿</span> <span class="hover">投稿</span> </div> </a> </li> <li> <a href="私信 "> <div class="nav_block"> <span>私信 </span> <span class="hover">私信 </span> </div> </a> </li> <li> <a href="存档"> <div class="nav_block"> <span>存档</span> <span class="hover">存档</span> </div> </a> </li> <li> <a href="订阅"> <div class="nav_block"> <span>订阅</span> <span class="hover">订阅</span> </div> </a> </li>
如果我在限制上面的span中的字符
$("nav_block span")wordLimit();
它使用了下面的一个算定义jquery插件的方法这是我从点点网扣下来的
// copyright c by zhangxinxu v // /* $("test")wordLimit(); 自动获取css宽度进行处理如果css中未对test给定宽度则不起作用$("test")wordLimit(); 截取字符数值为大于的整数这里表示class为test的标签内字符数最多个*/(function($){$fnwordLimit = function(num){thiseach(function(){if(!num){var copyThis = $(thiscloneNode(true))hide()css({position: absolutewidth: autooverflow: visible});$(this)after(copyThis);if(copyThiswidth()>$(this)width()){$(this)text($(this)text()substring($(this)text()length));$(this)html($(this)html()+);copyThisremove();$(this)wordLimit();}else{copyThisremove(); //清除复制return;}}else{var maxwidth=num;if($(this)text()length>maxwidth){$(this)text($(this)text()substring(maxwidth));$(this)html($(this)html()+);}} });} })(jQuery);
