![]() |
![]() |
![]() | |
![]() |
HOME / ご利用について / リンクに関して / 推奨環境 / 免責・規約 / お問合せ / リンク集 / Q&A | ||
![]() | |||
![]() |
![]() ![]() ![]() ![]() |
![]() |
HOME >> JavaScript 活用編 >> ポップアップウィンドウから元のウィンドウを操作する ■ ポップアップウィンドウから元のウィンドウを操作する
カラー選択ツールを開いて好みの色をクリックしてください。 文字や絵の色が変わります。
Gallery の画像はテーブルを作ってその中に設置していますが、そのテーブルの背景色を変更することで絵や文字の色を変えています。 絵の部分は透過画像となっており、テーブルの背景色がそのまま表示されるため、絵の部分のみ色が変わったように見えます。 色の変更は「changeColor 関数」で行っています。 カラー選択ツールで色のボックスをクリックしたときに、「onclick イベントハンドラ」を使って、関数を起動して色の変更を行います。 [ changeColor 関数の内容 ]
function changeColor(obj) {
opener.window.document.getElementById('gallery').style.backgroundColor = obj; }
ポップアップウィンドウからオープン元のウィンドウを操作する場合には「opener プロパティ」を使用します。 関数の呼び出し 関数を呼び出す場合には、引数に色を指定します。 (16進数・RGB・カラーネームどの方式でも指定できます) 例): onclick="changeColor( '#ff0000' )" changeColor の動作 関数の内容は簡単で、1行のみです。 画像を配置したテーブルの背景色を、引数に指定した色に変更します。 サンプルでは、テーブルのID名を「gallery」にしています。 テーブルの指定部分 ・・・・ opener.window.document.getElementByID('gallery') 「opener」 でオープンもとのウィンドウを指定しています。 背景色の変更部分 ・・・・ style.backgroundColor = obj; 「obj」は引数で指定された色番号(色名)です。
Copyright (C) since 2004 有限会社ミスティーネット All Rights Reserved .
|
![]() |
![]() |