Last Update: Nov.1,2014

JavaScript Sample

動作確認: ○IE6SP3(WinXP) ○Firefox33(WinXP) ○Chrome38(WinXP)

ポップアップウィンドウ表示をオブジェクト化してみました。

■ サンプル

クリックすると別ウィンドウが開きます。

■ ソース

/********************************************************
 *
 *  ポップアップウィンドウ・オブジェクト
 *
 *  Copyright (c) 2008,2009,2014 AOK. All Rights Reserved.
 *
 ********************************************************/
var popupWindow = function() {
  this.pWnd = null;
  this.target = "_popup_window";
  this.features = {
    channelmode:0, directories:0, fullscreen:0, location:0,
    menubar:0, resizable:0, scrollbars:0, status:0, toolbar:0
  };

  this.size = function(w, h) {
    this.features['width'] = w;
    this.features['height'] = h;
  };

  this.position = function(x, y) {
    this.features['left'] = x;
    this.features['top'] = y;
  };

  this.center = function(w, h) {
    this.size(w, h);
    var l = parseInt((screen.availWidth-w)/2);
    var t = parseInt((screen.availHeight-h)/2);
    this.position(l, t);
  };

  this.open = function(url) {
    var list = new Array();
    for (var i in this.features) {
      list.push(i + '=' + this.features[i]);
    }
    this.pWnd = open(url, this.target, list.join(','));
    if (this.pWnd) {
      this.pWnd.focus();
      return true;
    }
    return false;
  };

  this.close = function() {
    if (this.pWnd && !this.pWnd.closed)
      this.pWnd.close();
  };
};

/********************************************************
 *
 *  エントリーポイント
 *
 ********************************************************/
jQuery(function($) {
  var puw = new popupWindow();
  puw.center(400, 400);
  $('ul.popup a').unbind().click(function() { return !puw.open(this.href); });
  $(window).unload(function() { puw.close(); });
  var src = $('#ro_script').text() || $('#ro_script').html();
  $('#viewsrc').html((new JSParser()).parse(src));
});