Magnificpopup无法在谷歌浏览器以外的其他浏览器上运行

时间:2014-05-06 07:25:55

标签: javascript

我已成功设法让我的magnificPopup在页面上显示一个表单,但它只在我使用谷歌浏览器浏览器时工作,但其他浏览器如Mozilla和IE弹出窗口没有响应。

这是我的HTML代码

<button class="btn btn-8 btn-8b"><a class="popup-with-zoom-anim" href="#small-dialog">Call Now</a></button>
<!-- start magnific-->
<div id="small-dialog" class="mfp-hide">
  <div class="plans_table">
    <table width="100%" cellspacing="0" class="compare_plan">
      <thead>
        <tr>
          <th class="plans-list"><h3>Plan Features</h3></th>
          <th class="plans-list"><h3>Basic</h3><h4>$5<small>/month</small></h4></th>
          <th class="plans-list"><h3>Economy</h3><h4>$9<small>/month</small></h4></th>
        </tr>
      </thead>
      <tfoot>
        <tr>
          <td> </td>
          <td class="Call_now"><a href="#account" class="scroll"><button>Call Now</button></a></td>
          <td class="Call_now"><a href="#account" class="scroll"><button>Call Now</button></a></td>
        </tr>
      </tfoot>
      <tbody>
        <tr>
          <td class="plan_list_title">Web Space</td>
          <td class="price_body">Unlimited</td>
          <td class="price_body">Unlimited</td>
        </tr>
        <tr>
          <td class="plan_list_title">Bandwidth</td>
          <td class="price_body">Unlimited</td>
          <td class="price_body">Unlimited</td>
        </tr>
        <tr>
          <td class="plan_list_title">25 GB Storage</td>
          <td class="price_body"><img src="web/images/icon-remove.png" alt="img"></td>
          <td class="price_body">Unlimited</td>
        </tr>
        <tr>
          <td class="plan_list_title">iPhone App</td>
          <td class="price_body"><img src="web/images/icon-remove.png" alt="img"></td>
          <td class="price_body">Unlimited</td>
        </tr>
        <tr>
          <td class="plan_list_title">Enhanced Security</td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
        </tr>
        <tr>
          <td class="plan_list_title">E-mail</td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
        </tr>
        <tr>
          <td class="plan_list_title">Wordpress Support</td>
          <td class="price_body"><img src="web/images/icon-remove.png" alt="img"></td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
        </tr>
        <tr>
          <td class="plan_list_title">24/7 Support</td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
        </tr>
        <tr>
          <td class="plan_list_title">Backups</td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
          <td class="price_body"><img src="web/images/tickmark-icon.png" alt="img"></td>
        </tr>
        <tr>
          <td class="plan_list_title">Dedicated IP</td>
          <td class="price_body">$2/mo</td>
          <td class="price_body">$2/mo</td>
        </tr>
      </tbody>
    </table>   
  </div>
</div>

我的JS

jQuery(document).ready(function() {
  $('.popup-with-zoom-anim').magnificPopup({
    type: 'inline',
    fixedContentPos: false,
    fixedBgPos: true,
    overflowY: 'auto',
    closeBtnInside: true,
    preloader: false,
    midClick: true,
    removalDelay: 300,
    mainClass: 'my-mfp-zoom-in'
  });
});`

0 个答案:

没有答案