0

ガイダンスを提供するために使用する css ツールチップがあり、それを jqgrid に含めようとしています。

ただし、ホバーすると列のタイトルが表示されます。<span>しません。を追加しようとしましtitle:falseたが、何も起こりません。

私が使用しているcssは次のとおりです。

.tooltip { border-bottom:1px dotted #000000; outline:none; text-decoration:none; cursor:help; }
.tooltip:hover em { padding: .2em 0 .6em 0; font-weight:bold; display:block; }
.tooltip { position:relative; }
.tooltip:hover span { position:absolute; left:1em; top:-4.5em; z-index:99; margin-left:0; width:150px; }
.tooltip:hover em { border:0; margin: -10px 0 0 -55px; float:left; position:absolute; }
.tooltip span { margin-left:-999em; position:absolute; }

そして、これがどのように適用されるかです：

    <a class='tooltip' href='#'>
<img alt='Help' src='/Images/question_mark_sm.png' />
<span class='tooltip_classic info'>Guidance Tag</span>
</a>

jqGrid以外の場所で機能する理由がわかりません。いろいろ試してみましたが、うまくいかないようです。(ええと、画像が表示され、カーソルが変化しますが、ポップアップは表示されません。)

4

1 に答える 1

1

jqGrid セルから tooltip 属性を削除してみてください。

私にとっては、IE7 を除くすべてのブラウザで問題なく動作します。jqGrig gridComplete イベントを使用しました。

次に例を示します。

// _YourColID is you column name from colModel
$("td[aria-describedby*=_YourColID]", "#yourGridID tr").removeAttr("title");
$("td[aria-describedby*=_YourColID]", "#yourGridID tr").tooltip({

  // each trashcan image works as a trigger
  tip: '.tooltip',

  // custom positioning
  position: 'center right',                 

  // move tooltip a little bit to the right
  offset: [0, -10],                 

  // there is no delay when the mouse is moved away from the trigger
  delay: 0,                 
  predelay: 2000,                   
  onShow: function(e){
    if ($(e.target).parent("tr").attr('id') != -1) {
      yourTooltipFunction($(e.target).parent("tr").attr("id"));
    }
  }
}).dynamic({
  bottom: {
    direction: 'down',
    bounce: true
  }
});
于 2012-05-18T17:06:42.087 に答える