0

flotchart.org）jqueryを使用した散布図グラフィックアプリケーションの場合。

プロットオーバーイベントの下で、ツールチップを表示し、以下を作成する関数を介して動的に表示します。

$('<div id="tooltip" class="tooltip">' + contents + '</div>') 
  .css({
  top: absoluteY,
  left: absoluteX,
} ).appendTo("body");

ところで、CSSファイルのCSSIDの説明は次のとおりです。

.tooltip {
  z-index:1000;
  display:none;
  position:absolute;
  padding:10px;
  margin:1em 0 3em;
  border:5px solid #6B6B6B;
  color:#333;
  background:#fff;
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;     
  opacity: 0.87
}

ツールチップボックスが画面内に表示されるように調整する必要があるCSS属性があるかどうかを誰かが理解するのを手伝ってもらえますか？ところで、ボックスの寸法の自動調整は問題ありませんが、切り捨ては問題ありません。

こちらのスクリーンショットをご覧ください：

スクリーンショット1：親div内にある場合、ツールチップが正しく表示される

スクリーンショット2：ポイントが画面（div？）の右マージンの近くにあるときにツールチップが切り捨てられる

私のCSSの無知のために申し訳ありません/どうもありがとう！ジョルジオ

4

2 に答える 2

0

ツールチップ css に追加z-index:1000;してみてください。これにより、ツールチップ div をページ上の他のものの上に置くことができます。

于 2012-11-13T10:44:11.243 に答える
0

overflow: visible親はこの問題を解決します

于 2012-11-13T11:19:35.400 に答える