首页>>Jquery文字>>响应式弹出层,支持各种不同特效(2015-07-08)

响应式弹出层,支持各种不同特效

响应式弹出层,支持各种不同特效
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

JavaScript Code
  1. <script>  
  2. (function($){  
  3.         $(function(){  
  4.           $('[data-dialog]').on('click', function(e){  
  5.             var $this = $(e.target);  
  6.             $($this.data('dialog')).attr('class', 'popup '+$this.data('effect'));  
  7.           });  
  8.         });  
  9.       })(jQuery);  
  10.   $(document).ready(function(){  
  11.     $('.popup').popup({  
  12.       close: function(){  
  13.         $(this).find('.embed-container').empty();  
  14.       }  
  15.     });  
  16.       
  17.     $(document).on('click', '[data-action="watch-video"]', function(e){  
  18.   
  19.       e.preventDefault();  
  20.   
  21.       var plugin = $('#popup-video.popup').data('popup');  
  22.   
  23.       $('#popup-video.popup .embed-container').html(  
  24.         '<iframe src="'  
  25.         + e.currentTarget.href  
  26.         + '?autoplay=1" frameborder="0" allowfullscreen />'  
  27.       );  
  28.   
  29.       plugin.open();  
  30.     });  
  31.   
  32.   });  
  33.   
  34. </script>  

 


原文地址:http://www.freejs.net/article_jquerywenzi_485.html