Question

我对此内容小组有两个问题

以下是javascript book的代码

HTML:  
<div id="share-options">
    <img src="img/modal-window-message.gif" width="284" height="167"  alt="Share the magic of Monsieur Pigeon with your chums" id="message" />
    <div id="links">
        <a href="http://www.facebook.com/"><img src="img/icon-facebook.png" width="25" height="25" alt="Facebook icon" /></a>
        <a href="http://www.pinterest.com/"><img src="img/icon-pinterest.png" width="25" height="25" alt="Pinterest icon" /></a>
        <a href="http://www.twitter.com/"><img src="img/icon-twitter.png" width="25" height="25" alt="Twitter icon" /></a>
    </div>
</div>

jQuery的：

var modal = (function() {                         
    var $window = $(window);                        
    var $modal = $('<div class="modal"/>');         
    var $content = $('<div class="modal-content"/>');
    var $close = $('<button role="button" class="modal-close">close</button>');

    $modal.append($content, $close);                

    $close.on('click', function(e){                 
        e.preventDefault();                           
        modal.close();                                
    });

    return {                                        
        center: function() {                          
          // Calculate distance from top and left of window to center the modal
          var top = Math.max($window.height() - $modal.outerHeight(), 0) / 2;
          var left = Math.max($window.width() - $modal.outerWidth(), 0) / 2;
          $modal.css({                                
            top:top + $window.scrollTop(),            
        left:left + $window.scrollLeft()          
          });
        },
        open: function(settings) {                     
          $content.empty().append(settings.content);   

          $modal.css({                                 
            width: settings.width || 'auto',           
            height: settings.height || 'auto'          
          }).appendTo('body');                         

          modal.center();                              
          $(window).on('resize', modal.center);        
         },
         close: function() {                           
          $content.empty();                            
          $modal.detach();                             
          $(window).off('resize', modal.center);       
        }
    };
}());

在计算中心位置时，我们为什么要使用Math.max（）？因为我认为div内容的大小不会改变。
参数settings的含义是什么？

关于Modal对象

0 个答案: