使用 Drupal 和 jquery 工具在 IE 7 和 6 中出现问题

Question

虽然 Jquery 工具代码似乎在 chrome 和 FF 中运行良好，但在 IE 6 或 7 中不起作用...... http://designbracket.com/ 我在我们的服务链接及其下方的链接上使用覆盖（请原谅现在正在格式化...仍在网站上工作）

    <?php jquery_plugin_add('overlay'); ?>

<?php
drupal_add_js(
'$(function() {  

 // positions for each overlay
 var positions = [ 
  [0,  530],
  [400, 20],
  [400, 530],
  [0,  20]    
 ]; 

 // setup triggers
 $("#Mone[rel],#Mtwo[rel], #Mthree[rel], #Mfour[rel]").each(function(i) {

  $(this).overlay({

   // common configuration for each overlay
   oneInstance: false, 
   closeOnClick: false, 

   // setup custom finish position
   top: positions[i][0],
   left: positions[i][1],



  });   
 });

});',
'inline'

); ?>
<STYLE>
div.overlay {

 /* growing background image */
 background-image:url(http://flowplayer.org/img/overlay/white.png);

 /* dimensions after the growing animation finishes  */
 width:600px;
 height:470px;  

 /* initially overlay is hidden */
 display:none;

 /* some padding to layout nested elements nicely  */
 padding:55px;
}

/* default close button positioned on upper right corner */
div.overlay div.close {
 background-image:url(http://flowplayer.org/img/overlay/close.png);
 position:absolute;
 right:5px;
 top:5px;
 cursor:pointer;
 height:35px;
 width:35px;
}

</STYLE>

<table style="margin-left:75px;">
<tr>
<td style="width:165px; vertical-align:top">
<a href="#" rel="div.overlay:eq(0)" id="Mone"style="color:#12636e;font-size:17pt;">Our Services</a></br>
<ul>
<li><a href="#" rel="div.overlay:eq(1)" id="Mtwo">Digital Media </a></li>
<li><a href="#" rel="div.overlay:eq(2)" id="Mthree">Online Marketing</a></li>
<li><a href="#" rel="div.overlay:eq(3)" id="Mfour">Websites</a></li>
</ul>
</td>


</tr>
</table>




 <div class="overlay"> 
  <h2 style="margin:10px 0">Overlay </h2> 

  <p style="float: left; margin:0px 20px 20px 0;"> 
   <img src="http://static.flowplayer.org/img/title/tools24.png" /> 
  </p> 

  <p> 
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, 
    per inceptos himenaeos. Donec lorem ligula, elementum vitae, 
    imperdiet a, posuere nec, ante. Quisque mattis massa id metus.
  </p> 
 </div> 

 <div class="overlay"> 
  <h2 style="margin:10px 0">Overlay <me>#2</me></h2> 

  <p style="float: left; margin:0px 20px 20px 0;"> 
   <img src="http://static.flowplayer.org/img/title/tools24.png" /> 
  </p> 

  <p> 
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, 
    per inceptos himenaeos. Donec lorem ligula, elementum vitae, 
    imperdiet a, posuere nec, ante. Quisque mattis massa id metus.
  </p> 
 </div> 

 <div class="overlay"> 
  <h2 style="margin:10px 0">Overlay <me>#3</me></h2> 

  <p style="float: left; margin:0px 20px 20px 0;"> 
   <img src="http://static.flowplayer.org/img/title/tools24.png" /> 
  </p> 

  <p> 
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, 
    per inceptos himenaeos. Donec lorem ligula, elementum vitae, 
    imperdiet a, posuere nec, ante. Quisque mattis massa id metus.
  </p> 
 </div> 

 <div class="overlay"> 
  <h2 style="margin:10px 0">Overlay <me>#4</me></h2> 

  <p style="float: left; margin:0px 20px 20px 0;"> 
   <img src="http://static.flowplayer.org/img/title/tools24.png" /> 
  </p> 

  <p> 
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, 
    per inceptos himenaeos. Donec lorem ligula, elementum vitae, 
    imperdiet a, posuere nec, ante. Quisque mattis massa id metus.
  </p> 
 </div> 


 <div class="overlay"> 
  <h2 style="margin:10px 0">Overlay <me>#5</me></h2> 

  <p style="float: left; margin:0px 20px 20px 0;"> 
   <img src="http://static.flowplayer.org/img/title/tools24.png" /> 
  </p> 

  <p> 
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, 
    per inceptos himenaeos. Donec lorem ligula, elementum vitae, 
    imperdiet a, posuere nec, ante. Quisque mattis massa id metus.
  </p> 
 </div> 

请建议我做什么才能使其在 IE 6 和 7 中工作。为了方便检查代码，我确保它包含 HTML 和 CSS。因此，要检查，只需在您的测试 drupal 站点中剪切复制粘贴即可。

谢谢

Answer 1

我能够解决这个问题..显然 IE 造成麻烦只是由于一个额外的逗号..