Question

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

    <?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只是因为额外的逗号而引起麻烦..

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

1 个答案: