IE 和 Jquery qTip 插件的问题答案

【问题标题】：Problem with IE and Jquery qTip pluginIE 和 Jquery qTip 插件的问题
【发布时间】：2013-09-25 12:38:52
【问题描述】：

我在使用 Jquery qtip 插件时遇到问题。

它在 Firefox 中运行良好（参见此处http://movieo.no-ip.org/ 将鼠标悬停在第一张图片上）。

但在 IE 中不起作用。这是代码：

$('.moviebox').each(function() {
   $(this).qtip({
      content: $(this).children('.info'),
      show: 'mouseover',
      hide: 'mouseout',

      style: { name: 'light' },
      position: {
         corner: {
            target: 'rightbottom',
            tooltip: 'bottomleft'
         }
      }
   });
});

还有html

<!--start moviebox-->
  <div class="moviebox">
  <a href="#">
  <img src="http://1.bp.blogspot.com/_mySxtRcQIag/S6deHcoChaI/AAAAAAAAObc/Z1Xg3aB_wkU/s200/rising_sun.jpg" />
  </a>
  <!--start infobox-->
    <div class="info">
  <span>Rising Sun (2006)</span>
  <div class="description"><strong>Description:</strong><br /> test test  test test test  test test test  test test test  test test test  test test</div>
  <img src="http://1.bp.blogspot.com/_mySxtRcQIag/S6deHcoChaI/AAAAAAAAObc/Z1Xg3aB_wkU/s200/rising_sun.jpg" /> 
<div class="cast"><strong>Cast:</strong><br /> Sean connery</div>
  <div class="rating"><strong>Rating:</strong><br />5stars</div>
  </div>
  <!--end infobox-->
  </div>
  <!--end moviebox-->

为什么不能在 IE 中工作？？？？打败我。查看完整源代码的 movieo.no-ip.org

【问题讨论】：

标签： jquery internet-explorer cross-browser qtip

【解决方案1】：

尝试使用以下方法：

$('.moviebox').each(function() {
   $(this).qtip({
      content: $(this).find('.info'),
      show: 'mouseover',
      hide: 'mouseout',

      style: { name: 'light' },
      position: {
         corner: {
            target: 'rightbottom',
            tooltip: 'bottomleft'
         }
      }
   });
});

在 IE 中，.info 不是 .moviebox 的直接后代。

【讨论】：

非常感谢！有用。请问为什么在IE中它不是后代？？
猜测可能与您的圆角插件有关。看起来它正在将您的内容包装在额外的 div 中。

【解决方案2】：

你可以添加

<meta http-equiv="X-UA-Compatible" content="IE=Edge">

对于 IE，它会工作。

【讨论】：