0

これは私を夢中にさせています...

ファイル名のリストがあり、垂直方向にスクロールしたいだけなので、ファイル名 (=div) がリスト自体よりも広い場合は、完全な div を「引き出して」名前を表示したいと考えています。

この i アクションはこちらで確認できます: http://j25.wasen.net/index.php/news

ホバー時に div のクローンを作成し、それを本文に追加して、非常に高い zIndex を設定することで、これを解決しました。つまり、クローン div はすべての上に表示されますが、元の div と同じ位置に表示されます。

理由はよくわかりませんが、何らかの理由で、リストよりも幅が小さい div が間違った位置に表示されます。ただし、幅を超えるアイテムは適切な場所に表示されます。

名前を含む div がリストの幅を超えているかどうかを確認してから、クローンを作成することを考えました。これは、クローンが必要な場合でもあります。

ただし、divの真の幅を取得できません。キャッチする幅が表示されるように、Console.log ステートメントを追加しました。

リスト内のdiv（部分的に非表示）ではなく、本体（=クローン）に添付されたdivの幅を確認します...

div の実際の幅を取得するにはどうすればよいですか?

ありがとう！

4

2 に答える 2

0

あなたの一般的な前提は良いです。この例を参照してください。これを行うには私

  1. ホバーされたリストアイテムのクローンを作成します
  2. offset適切に配置するために使用します
  3. マウスを離れるときに、ホバーした要素を削除します

Hover不必要な点滅を引き起こしました。したがって、個別のイベント処理の理由。

http://jsfiddle.net/5zErQ/

var $clone;
$('li').mouseenter( function() {
  $clone = $('<span />', {text: $(this).text(), class:'temp'});
  $clone.css({position:'absolute', top:$(this).offset().top, left:$(this).offset().left});
  $('body').append($clone);
});

$('body').on('mouseleave', 'span', function() {
  $(this).remove();
});
于 2013-01-14T03:20:18.020 に答える
0

Mozilla 用の firebug プラグインをダウンロードします。インストールしたら、任意の要素を右クリックして、そのスタイルやレイアウトなどを表示できます。

右下のレイアウト タブを選択します。div にカーソルを合わせると、マージンとパディングを含む要素のサイズが表示されます。

ここからダウンロードしてください: https://getfirebug.com/

それが役立つことを願っています。

于 2013-01-11T14:28:30.667 に答える