8

CSS

.page{ 
      width: 275px;
      hight: 380px;
      overflow: auto;
     }

HTML

<div class="page">dynamic text</div>

動的テキストが div の固定高さを超えてオーバーフローしている場合、新しい div を作成する方法は?

例：

<div class="page">Some dynamic texts will appear here</div>

動的テキストが div の固定の高さを超えてはみ出すと、上のコンテンツはこのように表示されます。

<div class="page">Some dynamic</div>
<div class="page">texts will</div>
<div class="page">appear here</div>

動作するPHPwordwrap($dynamic_text, 600, '</div><div class="page">');でwordwrap関数を使ってみたのですが、Ms.Wordsから文字をコピーする際に問題がありました。したがって、オーバーフローしたテキストを検出し、それを切り取り、新しい div 要素に貼り付けることがより良い解決策だと思います。しかし、JQuery または Javascript を使用してこのソリューションを実行する方法がわかりません。

何か案は？前もって感謝します！

4

2 に答える 2

2

あなたはそれを行うことができます。それは単なる数行のコードではありません。非常に経験豊富な開発者が数日かかりました。コードを共有できません。

Javascript: コンテンツ全体を div に入れます。しばらくの間、非表示にするか、DOM から除外することができます。div の子をトラバースします。top+scrollHeight が div の高さを超えているものを見つけます。再帰的にトラバースします。最終的に、収まらない画像などの分割できない要素を見つけるか、テキスト ノード内でテキストを分割する位置を見つけます。その部分とそれ以降のすべての要素を div から削除します。それらを新しいものに追加します。

対処すべき詳細がたくさんあるので、簡単ではありません。しかし、実行可能です。

于 2012-12-25T08:03:26.757 に答える