获得Magnific Popup与RequireJS一起工作

我是使用RequireJS和Magnific Popup的新手，我想知道是否有人成功地让他们一起玩。如果是这样，你的代码的基本结构是什么？获得Magnific Popup与RequireJS一起工作

谢谢！

2014-10-28 DNLD

首先建立在HTML文件中emtry点：

<!DOCTYPE html> 
<html> 
    <body> 
    <script data-main="entrypoint" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.15/require.min.js"></script> 
    </body> 
</html>

然后在entrypoint.js可以配置jQuery和荡气回肠弹出：

require.config({ 
    paths : { 
    jquery : '//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min', 
    magnificpopup : 'path/to/magnific-popup.min', 
    }, 
    shim: { 
    'magnificpopup': ['jquery'] 
    } 
}); 

require([ 'popuptest' ], function(popuptest) { 
    popuptest.show(); 
});

最后，popuptest.js我们可以打开一个youtube弹出像这样：

define(['jquery', 'magnificpopup'], function($, magnificpopup) { 
    return { 
    show: function() { 
     $.magnificPopup.open({ 
     items: { 
      src: 'https://www.youtube.com/watch?v=btPJPFnesV4' 
     }, 
     type: 'iframe', 
     iframe: { 
      cursor: null, 
      titleSrc: function(item) { 
      return 'Video title'; 
      }, 
      patterns: { 
      youtube_short: { 
       index: 'youtu.be/', 
       id: 'youtu.be/', 
       src: '//www.youtube.com/embed/%id%?autoplay=1' 
      } 
      } 
     } 
     }); 
    } 
    }); 
});

希望这会有所帮助。

来源

2015-07-12 02:48:10 agukrapo

获得Magnific Popup与RequireJS一起工作

回答

相关问题