阻止izimodal通过组功能进行预加载

时间:2019-07-26 08:20:57

标签: javascript onclick izimodal

Izimodal正在预加载内容。当我单击链接之一时,我想加载它。 Onclick在我的脑海中,但我不确定izimodal的组功能是否能正常工作...

我对onclick不做任何尝试,因为我很确定组功能将无法使用。

<html><head>
<link rel="stylesheet" type="text/css" href="https://raw.githubusercontent.com/marcelodolza/iziModal/master/css/iziModal.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/marcelodolza/iziModal/master/js/iziModal.min.js"></script></head><body>
<script>    
    $(function(){
      $(".modalgroup").iziModal({
        history: false,
        fullscreen: true,
        headerColor: '#000000',
        transitionIn: 'fadeInDown',
        group: 'group1',
        loop: true,
        navigateCaption: false,
        zindex: 99999
      });
    })
</script>
<!-- iframe -->
 <a href="https://example.com" data-izimodal-open="#iframe-id" target="_blank" title="iframe title">Open iframe</a>
 <div id="iframe-id" class="modalgroup" data-iziModal-iframe="true" data-izimodal-title="iframe title" data-izimodal-iframeURL="example.com"></div>
<!-- Facebook -->
<a href="https://www.facebook.com/facebook" data-izimodal-open="#facebook-id" target="_blank" title="Facebook Site">Open Facebook</a>
 <div id="facebook-id" class="modalgroup" data-izimodal-title="Facebook Site">
 <div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/de_DE/sdk.js#xfbml=1&version=v3.3"></script>
 <div class="fb-page" data-href="https://www.facebook.com/facebook" data-tabs="timeline,events,messages" data-width="" data-height="" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"></div>
 </div>
<!-- Twitter -->
<a href="https://twitter.com/twitter" data-izimodal-open="#twitter-id" target="_blank" title="Twitter Tweets">Open Twitter</a>
<div id="twitter-id" class="modalgroup" data-izimodal-title="Twitter Tweets">
<a class="twitter-timeline" data-dnt="true" data-height="450" href="https://twitter.com/twitter"></a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 
      </div>
</body></html>

我花了一天的时间在我的网站上运行此代码,并意识到,由于我在一个pageload上有多个此类代码,因此在后台加载所有JavaScript会使我的网站超载!

0 个答案:

没有答案