2

私はすでにうまくいかないように見える2つのアプローチを試しました. 2）各文字の高さをピクセル単位で測定し、テキスト全体のclientHeightを測定し、テキストの合計高さを1文字の高さで割って、1つの列に何行が入り、もう1つの列に何行が入るかを調べました. このアプローチは、画像、段落、およびその他の HTML タグを考慮する必要がある場合を除いて、非常にうまく機能します。

画像やその他の HTML タグを考慮した新しいアプローチを考え出す必要があり、使用できるのは HTML、CSS、および JavaScript のみです (JQuery、JSON、Ajax などは使用できません)。アイデア/アルゴリズムがあれば教えてください！ありがとう ：）

4

1 に答える 1

1

私はJSFiddlehttp : //jsfiddle.net/uWUBE/であなたのために素早く汚い「ハック」を作成しました

それがあなたを助けることを願っています、あなたはそれをよりダイナミックになるように編集することができます。ここにいくつかのコードがあります。基本的に、単語の量をループして、列に割り当てる文字列に追加します。私はJavascriptの首謀者ではないので、もっと良い方法があるかもしれません。

` 

//  Get the text
var txt = $("p").text();
//  Split every word
var words = txt.split(" ");
//  Count the amount of words
var amount = words.length
//  Amount of columns
var columnAmount = 2

//  Amount of words in first colum 
var firstColumn = Math.floor(amount / columnAmount);

//  String for first column
var firstColumnTxt = "";
//  String for second column
var secondColumnTxt = "";

//  loop trough the words and add them to the first column
for (var i = 0; i < firstColumn; i++){
    firstColumnTxt =     firstColumnTxt + " " + words[i]; 
}
//  loop trough the words and add them to the second column
for (var i = firstColumn; i < amount; i++){
    secondColumnTxt =   secondColumnTxt + " " + words[i];
}

// Add this to your first column
console.log(firstColumnTxt);
//  Add this to your second column
console.log(secondColumnTxt);

`

于 2013-01-14T11:14:10.393 に答える