|
阅读:2500回复:4
向诸位大人求教!关于火狐折行的一个问题。
今天在查询一个网页的时候再次出现了这个问题:
http://ed2k.shortypower.org/?hash=83567 ... ed1a96aa24 之前查阅过一些资料,传说这个是FF的万年BUG。 单凭CSS不能解决这个问题,只能使用脚本才有希望。之后四处寻访,在userscript上找到几个发现都不是很有效。不知道诸位大人能否推荐一个?先拜谢过! 另外想起sunwan大大之前的BTchina脚本里面有相关的折行办法,似乎是查找特定字符插入空格。代码如下。不知道是否能够移植用于上面的那个链接页面。 pageChecker.prototype.insertSpace = function insertSpace(str) {
var lablePos = []; // 标签位置
var lableValue = []; // 标签值
var s = ""; // 去除了标签的字串
var s1 = ""; // 添加了空格后的字串
var s2 = ""; // 恢复了标签的字串
var index;
while ( str ) {
index = str.search(/(<[^<>]*>)/); // 查找标签位置
if ( index != -1 ) { // 找到
lableValue.push(RegExp.$1); // 保存标签值
s += str.substring(0,index); // 保存去除了标签的字串
lablePos.push(s.length); // 保存标签位置
str = str.substring( index + (RegExp.$1).length, str.length ); // 截断已查找部分
}
else {
s += str; // 保存字串
str = '';
}
s1 = insertSpace1(s,s1,lablePos); // 适当位置插入空格
}
// 恢复标签
for ( var i = 0, j = 0; i < lablePos.length; i++ ) {
s2 += s1.substring( j, lablePos[i] ) + lableValue[i];
j = lablePos[i];
}
s2 += s1.substring( j, s1.length );
return s2;
function insertSpace1(s,s1,pos) {
// 允许的最长连续ASCII字符,达到此长度则强行分割
var maxAsciiLength = 30;
// 匹配规定字符数以上的可见ASCII字符
var re = eval( '/([\x21-\x7e]{' + maxAsciiLength + ',})/' );
// 查找匹配字符串位置
var j = s.search(re);
// 没找到取整串,找到取前面的子串
s1 = ( j == -1 ) ? s : s.substring( 0, j );
while ( -1 != j ) {
s = s.substring( j + (RegExp.$1).length, s.length ); // 保存剩余的子串
// 往匹配字符串的') ] } . - _'后面插入空格并分组
var ss = (RegExp.$1).replace(/((?:[\)|\]|\}|\.|\-|_])+)/g,'$1 ').split(' ');
for ( var i = 0; i < ss.length; i++ ) {
if ( ss[i] && ss[i].length > maxAsciiLength ) {
while ( ss[i] && ss[i].length > maxAsciiLength ) {
// 分组后的子串长度大于最长连续字符数,在最长连续字符数后插入连线符及空格
s1 += ss[i].substring(0,maxAsciiLength) + '_ ';
fixPos(s1.length-2, 2, pos); // 调整标签位置
ss[i] = ss[i].substring(maxAsciiLength,ss[i].length);
}
s1 += ss[i];
}
else {
if ( i == ss.length - 1 ) {
// 是最后分组则连接以待处理
s1 += ss[i];
}
else {
// 非最后分组则连接并插入空格
s1 += ss[i] + ' ';
fixPos(s1.length-1, 1, pos); // 调整标签位置
}
}
}
j = s.search(re); // 循环处理匹配字符串后面的子串
s1 += ( j == -1 ) ? s : s.substring( 0, j );
}
return s1;
} |
|
|
1楼#
发布于:2010-01-11 23:27
lz提供的网址在哪里需要折行?表格是没法折行的吧。
另外这个脚本是无视屏幕宽度强行折行的,在不同的网站针对不同的屏幕宽度可能要设置不同值。 |
|
|
2楼#
发布于:2010-01-11 23:27
主要是文件名那一栏。太长的话,就把表格撑开了,超出页面宽度(当然这个也取决于屏幕宽度)
希望是能实现下图这样的折行效果。
本来理想的情况是给中间那个table设置最大宽度,再使用脚本令其在所设置宽度的限制下进行折行,不知道是否有可能。 |
|
|
3楼#
发布于:2010-01-11 23:27
单凭CSS不能解决这个问题 css没准也能奏效: @-moz-document domain("ed2k.shortypower.org") {
table th,tr.a td:nth-of-type(2),tr.b td:nth-of-type(2)
{white-space: normal !important;}
tr.a td:nth-of-type(2),tr.b td:nth-of-type(2),tr.a+tr th:nth-of-type(2),tr.b+tr th:nth-of-type(2)
{text-align: justify !important;}
} |
|
|
|
4楼#
发布于:2010-01-11 23:27
厉害!harnack大大果然出手不凡~
之前试过{white-space: normal !important;}不过只能令第一列换行。 貌似是FF3.5新支持的属性?还不知道具体的用法。 如此网上流传的CSS不可解决此问题的传言看来要终结了。 |
|