三井不動産レジデンシャル株式会社 御中 「三井の住まい 物件ページ」 モーダルウィンドウ設置調整について 2014 . 5.16 トランスコスモス株式会社 デジタルマーケティングサービス総括 ウェブインテグレーションサービス本部 モーダルウィンドウの設置箇所 修正 間取りページや全ページフッター部に設置するモデルルー ム案内図はモーダルウィンドウでの表示をするために特定 のclassを設定しています。 該当するaタグにclass=“iframe”を付与します。 変更前 (旧 テンプレhtml) 変更後 <p class="mr10"><a class="ajax" href="plan/popup01.html"><img src="plan/images/plan_img_01.gif" /></a></p> <p class="mr10"><a class="iframe" href="plan/popup01.html"><img src="plan/images/plan_img_01.gif" /></a></p> <p class="mr10"><a class="ajax" href="plan/popup02.html"><img src="plan/images/plan_img_01.gif" /></a></p> <p class="mr10"><a class="iframe" href="plan/popup02.html"><img src="plan/images/plan_img_01.gif" /></a></p> <p><a class=“ajax" href="plan/popup03.html"><img src="plan/images/plan_img_01.gif" /></a></p> <p><a class="iframe" href="plan/popup03.html"><img src="plan/images/plan_img_01.gif" /></a></p> <li><a href="map.html"><img src="common/images/submenu_txt_01.gif" alt="モデルルーム案内図" width="159" height="24" class="rollover" /></a></li> <li><a class="iframe" href="map.html"><img src="common/images/submenu_txt_01.gif" alt="モデルルーム案内図" width="159" height="24" class="rollover" /></a></li> ~ The Marketing Chain Management Company ~ transcosmos inc. Proprietary and Confidential -2- 全ページのヘッダー内記述 修正 ヘッダー内に共通で読み込むモーダルウィンドウ用の 「colorbox.css」 と 「jquery.colorbox-min.js」 がHTMLに記述されていない場合は、 呼び出す記述を追記して下さい。 変更前 (旧テンプレhtml) 変更後 <!-- ▽【commonArea_02】ここから下はコメントを含め変更・削除しないでください ▽ -> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/css/module.css" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/resident/css/resident_module.css" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/resident/css/resident.css" media="all" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/resident/component/jcarousel/skins/skin. css" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/resident/css/print.css" media="print" /> <!-- ▽【commonArea_02】ここから下はコメントを含め変更・削除しないでください ▽ -> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/css/module.css" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/resident/css/resident_module.css" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/resident/css/resident.css" media="all" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/resident/component/jcarousel/skins/skin. css" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/resident/css/print.css" media="print" /> <link rel="stylesheet" type="text/css" href="http://www.31sumai.com/common/component/colorbox/colorbox.css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script> <script src="http://www.31sumai.com/common/resident/component/jcarousel/jquery.jcaro usel.min.js" type="text/javascript"></script> <script src="http://www.31sumai.com/common/js/baseEvent.js" type="text/javascript"></script> <script src="http://www.31sumai.com/common/resident/js/resident.js" type="text/javascript"></script> <!--[if IE 6]> <script type="text/javascript" src="http://www.31sumai.com/common/resident/js/DD_belatedPNG.js"></script> <script type="text/javascript">DD_belatedPNG.fix('img,div,p,li,.bullet2,.bullet3');</script> <![endif]--> <!-- △【commonArea_02】ここから上はコメントを含め変更・削除しないでください △ -> ~ The Marketing Chain Management Company ~ transcosmos inc. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script> <script src="http://www.31sumai.com/common/resident/component/jcarousel/jquery.jcaro usel.min.js" type="text/javascript"></script> <script src="http://www.31sumai.com/common/component/colorbox/jquery.colorboxmin.js" type="text/javascript"></script> <script src="http://www.31sumai.com/common/js/baseEvent.js" type="text/javascript"></script> <script src="http://www.31sumai.com/common/resident/js/resident.js" type="text/javascript"></script> <!--[if IE 6]> <script type="text/javascript" src="http://www.31sumai.com/common/resident/js/DD_belatedPNG.js"></script> <script type="text/javascript">DD_belatedPNG.fix('img,div,p,li,.bullet2,.bullet3');</script> <![endif]--> <!-- △【commonArea_02】ここから上はコメントを含め変更・削除しないでください △ Proprietary and Confidential -3- モーダルで開く対象HTMLのヘッダー 修正 モーダルウィンドウ内で印刷を行う際には、 印刷用CSSを設定する必要があります。 テンプレートでは 「print_modal.css」 を設定しています。 読み込むCSSがHTMLに記述されていない場合は呼び出す 記述を追記して下さい。 変更前 (旧テンプレhtml) 変更後 <link rel="stylesheet" type="text/css" href="../common/css/article_common.css" media="all" /> <link rel="stylesheet" type="text/css" href="../common/css/article_module.css" media="all" /> <link rel="stylesheet" type="text/css" href="../common/css/article_common.css" media="all" /> <link rel="stylesheet" type="text/css" href="../common/css/article_module.css" media="all" /> <link rel="stylesheet" type="text/css" href="../common/css/print_modal.css" media="print" /> ~ The Marketing Chain Management Company ~ transcosmos inc. Proprietary and Confidential -4-
© Copyright 2025 ExpyDoc