javascript＆cssで完全に表示されない行を非表示にする

Question

これは不可能かもしれないが、JQueryを使用して、行全体がスクロールするときに完全に表示されない行が表示されないようにする方法がある表示されますか？それは私たちが現れてからこのような何かを防ぎたい、次のとおりです。

ありがとう！

Answer 1

私は@rahmanisbackに同意しますが、ユーザーのブラウジングエクスペリエンスを混乱させることはありません。

しかし、「中間」の良い解決策は、透明ピクセルのグラデーションを使用して、下のピクセルがフェードアウトすることです。しかし、それは "全体"の行にも当てはまるので、おそらくあなたの問題の良い解決策ではありません。

Answer 2

これを行うには何かがあるかどうかわかりません。しかし、私はそれが視覚的な増強をこれまで以上に行うという混乱をさらに引き起こすと思う。ユーザーはスクロールするときに幸せにならず、スクロールするアクションの結果として通常は緩むのとは反対に突然「ポップアップ」する行を見つけます。スクロールバーが表示されたスクロール可能なHTML要素について話すとき、ユーザーはテキストが部分的に表示されている可能性があり、それは正常であり、残りの部分を読むためにスクロールする必要があることを認識しています。私は本当にそれをお勧めしません。

しかし、技術的な答えについては、そのスクロール要素のCSS line-heightプロパティを修正する必要があると思います。例えば、8pxにするなどレイアウトに合ったものにします。次に、スクロールイベントをキャプチャし、jQuery scrollTop（）をそのCSSの行の高さで割り出し、結果をチェックします。それが小数点を持つ場合は、「部分的に見える」行があることを意味します。計算時に間違いを引き起こす可能性のある余白とパディングを忘れないでください。

Answer 3

私はこの問題もあったと信じています。特定の高さとオーバーフローが隠されたdivがあると思います。

考えてみると、divのテキストの行の高さに基づいてdivのサイズを変更します。

divの高さを、含まれているテキストの行の高さの倍数に変更します.... つまり、行の高さ= 16の3行のテキストがdivの高さを50から48pxに変更します。

（私はrahmanisback」と答えたと同時にこの投稿を）

Answer 4

仮にあなたが、テキスト領域の高さを測定ラインの高さを測定し、スクロール位置を見つけることができるいくつかの計算を行うと、その後のいくつかの方法がありますまだ十分に露出されていないテキストを隠している（例えば、あなたの数学に応じてxの高さの白い部分を使う）。しかし、通常は問題ではないものに行くのは大変な問題です。また、オーバーフロープロパティで何かできることがあるかもしれませんが、私にはわからない問題があるかもしれません。

私は実装が簡単な別の方法を考えました。スクロールイベントをキャプチャし、行の高さに最も近い倍数に変更します。