マニュアルキャンセル

JavaScript に組み込まれているビヘイビアーの適用

検索

最終更新日 : 2021年4月28日

Dreamweaver

アプリを開く

Adobe Dreamweaver で JavaScript に組み込まれているビヘイビアーを適用する方法を説明します。

組み込みビヘイビアーの使用

Dreamweaver に搭載されているビヘイビアーは、最新のブラウザーで動作するように記述されています。古いブラウザーでは、ビヘイビアーはエラーを報告せずに終了します。

注意：

Dreamweaver のアクションは、できるだけ多くのブラウザーで動作するように慎重に記述されています。Dreamweaver のアクションから手動でコードを削除したり、そのコードをユーザー独自のコードに置き換えると、ブラウザー間の互換性がなくなる可能性があります。

Dreamweaver のアクションは異種ブラウザー間での互換性を最大化するように記述されていますが、ブラウザーの一部には JavaScript をまったくサポートしないものもあり、またブラウザーの JavaScript 機能をオフにして Web を参照するユーザーもたくさんいます。異種プラットフォーム間で最善の結果を得るには、JavaScript を使用しないユーザーもサイトを使用できるように、<noscript> タグで囲んだ代替インターフェイスを用意します。

「JavaScript の呼出し」ビヘイビアーの適用

「JavaScript の呼出し」ビヘイビアーでは、イベントの発生時に JavaScript コードのカスタム関数または行が実行されます。ユーザーが独自のスクリプトを記述することができます。また、Web から無償で入手できる様々な JavaScript ライブラリのコードを使用することもできます。

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「JavaScript の呼出し」を選択します。
実行する JavaScript を正確に入力するか、関数名を入力します。

例えば、「戻る」ボタンを作成するには、「if (history.length > 0){history.back()}」と入力します。コードを関数内にカプセル化した場合は、関数名だけ（例えば hGoBack()）を入力します。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「プロパティの変更」ビヘイビアーを適用します。

「プロパティの変更」ビヘイビアーを使用して、オブジェクトのプロパティの 1 つの値（div の背景色やフォームのアクションなど）変更します。

注意：

このビヘイビアーは、HTML および JavaScript に精通している場合に限り使用してください。

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「プロパティの変更」を選択します。
エレメントのタイプメニューからエレメントタイプを選択し、そのタイプの名前の付いたエレメントをすべて表示します。
エレメントの ID メニューからエレメントを選択します。
プロパティメニューでプロパティを選択するか、テキストボックスにプロパティ名を入力します。
「新規の値」フィールドに新規プロパティの新規の値を入力します。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「プラグインのチェック」ビヘイビアーの適用

「プラグインのチェック」ビヘイビアーを使用して、指定したプラグインがインストールされているかどうかに応じて、ビジターを異なるページに進ませます。例えば、Shockwave をインストール済みのビジターをあるページに進ませ、Shockwave をインストールしていないビジターを別のページに進ませることができます。

注意：

JavaScript を使用して Internet Explorer で特定のプラグインを検出することはできません。ただし、Flash または Director を選択すると、ページに適切な VBScript コードが追加されるので、これらのプラグインを Windows の Internet Explorer で検出することができます。プラグインの検出は、Mac OS の Internet Explorer では実行できません。

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「プラグインのチェック」を選択します。
プラグインメニューでプラグインを選択するか、「入力」をクリックして、隣のテキストボックスにプラグインの正確な名前を入力します。

Netscape Navigator の「Plug-ins について」のページに太字で明記されているように、プラグインの正確な名前を使用する必要があります（Windows では、Navigator のヘルプメニューから「Plug-ins について」コマンドを選択し、Mac OS では、Apple メニューの「Plug-ins について」を選択します）。
「URL」テキストボックスで、プラグインをインストールしているビジター用の URL を指定します。

リモート URL を指定する場合は、アドレスの先頭に「http://」を付ける必要があります。フィールドを空白のままにすると、同じページに留まります。
「代替 URL」テキストボックスで、プラグインをインストールしていないビジター用の代替 URL を指定します。フィールドを空白のままにすると、同じページに留まります。
プラグインを検出できない場合の動作を指定します。初期設定では、検出を実行できない場合、ビジターは「代替 URL」テキストボックスに表示されている URL に進みます。また、ビジターを最初の URL（「URL」フィールドに指定した URL）に進ませるには、「ActiveX が使用可能な場合、最初の URL に移動してください。」オプションを選択します。このオプションを選択すると、事実上このオプションは、「プラグインの不存在をブラウザーが明示的に示さない限り、ビジターがプラグインをインストールしているものと想定する」という意味になります。一般的に、プラグインコンテンツがページに必須の場合は、このオプションを選択し、必須でない場合は、このオプションの選択を解除します。

注意：

このオプションは、Internet Explorer のみに適用されます。Netscape Navigator では常にプラグインを検出できます。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「AP エレメントをドラッグ」ビヘイビアーの適用

「AP エレメントをドラッグ」ビヘイビアーを使用すると、ビジターは絶対位置（AP）のエレメントをドラッグできます。このビヘイビアーを使用して、パズル、スライダーコントロール、その他の移動可能なインターフェイスエレメントを作成します。

ビジターが AP エレメントをドラッグできる方向（水平、垂直、任意）、ビジターが AP エレメントをドラッグするターゲット、AP エレメントがターゲットから特定のピクセル数以内になったときの AP エレメントのターゲットへの吸着の有無、AP エレメントがターゲットをヒットしたときのアクション、その他を指定することができます。

「AP エレメントをドラッグ」ビヘイビアーは、ビジターが AP エレメントをドラッグする前に呼び出す必要があるので、「AP エレメントをドラッグ」を body オブジェクト（onLoad イベントとともに）に関連付けます。

挿入／レイアウトオブジェクト／絶対位置の Div を選択するか、挿入パネルの「絶対位置の Div を描画」ボタンをクリックして、ドキュメントウィンドウのデザインビューで絶対位置の Div を描きます。
ドキュメントウィンドウの左下隅にあるセレクターで <body> をクリックします。
ビヘイビアーパネルのビヘイビアーの追加メニューから、「AP エレメントをドラッグ」を選択します。

「AP エレメントをドラッグ」を使用できない場合は、AP エレメントが選択されている可能性があります。
AP エレメントポップアップメニューで、AP エレメントを選択します。
モーションポップアップメニューで、「制限あり」または「制限なし」のいずれかを選択します。

制限のないモーションは、パズル、その他のドラッグ＆ドロップゲームに適しています。スライダーコントロールと、ファイルの引き出し、カーテン、ミニブラインドのような動く景色には、制限のあるモーションを選択します。
制限のあるモーションの場合、「上」、「下」、「左」、「右」テキストボックスに値（ピクセル単位）を入力します。

値は、AP エレメントの開始位置を基準にしています。四角形領域内にモーションを制限するには、4 つのテキストボックスすべてに正の値を入力します。垂直方向のモーションだけを可能にするには、「上」と「下」に正の値を入力して、「左」と「右」には「0」と入力します。水平方向のモーションだけを可能にするには、「左」と「右」に正の値を入力して、「上」と「下」には「0」と入力します。
「左」と「上」のテキストボックスに、ドロップターゲット用の値（ピクセル単位）を入力します。

ドロップターゲットは、ビジターに AP エレメントをドラッグさせたいスポットです。AP エレメントは、左と上の座標が「左」と「上」テキストボックスに入力した値と合致したとき、ドロップターゲットに達したとみなされます。値は、ブラウザーウィンドウの左上隅を基準にしています。「現在位置の表示」をクリックすると、テキストボックスに AP エレメントの現在の位置が自動的に入力されます。
「吸着」テキストボックスに値（ピクセル単位）を入力して、ビジターがどれだけドロップターゲットに近づいてから AP エレメントをターゲットに吸着させるかを指定します。

この値が大きいほど、ビジターはドロップターゲットを見つけやすくなります。
簡単なパズルと景色の操作の場合、これで作業を終えることができます。AP エレメント用にドラッグハンドルを定義したり、ドラッグされているときに AP エレメントのモーションの後を追ったり、AP エレメントがドロップされたときにアクションを実行したりするには、「詳細設定」タブをクリックします。
AP エレメントの特定の領域をクリックしないとその AP エレメントをドラッグできないように指定するには、ドラッグハンドルメニューで、「エレメント内の領域」を選択して、ドラッグハンドルの上と左の座標、および幅と高さを入力します。

このオプションは、AP エレメント内部のイメージに、タイトルバーや描画ハンドルのように、ドラッグを示唆するエレメントが含まれているときに使うと便利です。ビジターが AP エレメントのどこをクリックしてもドラッグできるようにする場合は、このオプションを設定しません。
使用する「ドラッグ中」オプションを次の中から選択します。
- ドラッグ中に重ね順の最上部に AP エレメントを移動する必要がある場合は、「エレメントを前面に移動」を選択します。このオプションを選択した場合、ポップアップメニューで、AP エレメントを最上部に置いておくか、重ね順の元の位置に戻すかを選択します。
- JavaScript コードまたは関数名（例えば、monitorAPelement()）を「JavaScript の呼出し」ボックスに入力して、AP エレメントのドラッグ中にコードまたは関数を繰り返し実行します。例えば、AP エレメントの座標を監視して、「目標に近づいています」または「ドロップターゲットから見当はずれの位置です」などのヒントをテキストボックスに表示する関数を記述することができます。
JavaScript コードまたは関数名（例えば、evaluatePelementPos()）を 2 番目の「JavaScript の呼出し」ボックスに入力して、AP エレメントがドロップされるときにコードまたは関数を実行します。AP エレメントがドロップターゲットに達したときにだけ JavaScript が実行されるようにするには、「スナップした場合のみ」オプションを選択します。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

ドラッグ可能な AP エレメントについての情報収集

AP エレメントをドラッグするビヘイビアーをオブジェクトに関連付けると、Dreamweaver により MM_dragLayer() 関数がドキュメントの head セクションに挿入されます。関数は、AP エレメントの古い命名規則（つまり「Layer」）を保持するため、以前のバージョンの Dreamweaver で作成されたレイヤーは編集可能なまま保持されます。AP エレメントをドラッグ可能として登録するだけでなく、この関数は、各ドラッグ可能 AP エレメントに MM_LEFTRIGHT、MM_UPDOWN、および MM_SNAPPED の 3 つのプロパティを定義します。これらのプロパティは、AP エレメントの相対水平位置、AP エレメントの相対垂直位置、および AP エレメントがドロップターゲットに達したかどうかを判別するために、独自の JavaScript 関数で使用することができます。

注意：

ここで提供している情報は、経験のある JavaScript プログラマーのみを対象として提供しています。

例えば、以下の関数は、MM_UPDOWN プロパティ（AP エレメントの現在の垂直位置）の値を curPosField というフォームフィールドに表示します。「フォーム」フィールドは、ページのロード終了後もコンテンツを変更できるので、継続的に更新される情報を表示するのに役立ちます。

function getPos(layerId){ 
    var layerRef = document.getElementById(layerId); 
    var curVertPos = layerRef.MM_UPDOWN; 
    document.tracking.curPosField.value = curVertPos; 
}

フォームフィールドに MM_UPDOWN や MM_LEFTRIGHT の値を表示する代わりに、これらの値を他の様々な方法で使用することができます。例えば、値がどれだけドロップ領域に近いかに応じてメッセージをフォームフィールドに表示する関数を記述したり、値に応じて AP エレメントの表示と非表示を切り替える別の関数を呼び出したりできます。

複数の AP エレメントがページ上にあり、ビジターが次のページまたはタスクに進む前に、その AP エレメントすべてがターゲットに達する必要のある場合に、MM_SNAPPED プロパティの読み取りを行うと特に便利です。例えば、true の MM_SNAPPED 値をもつ AP エレメントの数を数える関数を記述し、AP エレメントがドロップされるつどこれを呼び出すことができます。吸着数が必要な数に達したときに、ビジターを次のページに進ませたり、祝辞メッセージを表示したりできます。

「URL に移動」ビヘイビアーの適用

「URL に移動」ビヘイビアーは、現在のウィンドウまたは指定したフレームで新規ページを開きます。このビヘイビアーは、2 つ以上のフレームのコンテンツを 1 回クリックするだけで変更する場合に便利です。

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「URL に移動」を選択します。
開くロケーションリストから URL の移動先を選択します。

開くロケーションリストには、現在のフレームセットのフレームすべての名前とメインウィンドウが自動的に一覧表示されます。フレームがない場合は、メインウィンドウが唯一のオプションです。

注意：

このビヘイビアーでは、フレームに top、blank、self、または parent という名前が付けられている場合、不測の結果を生じる場合があります。ブラウザーが、これらの名前を予約ターゲット名と間違う場合があるからです。
「参照」をクリックして開くドキュメントを選択するか、「URL」テキストボックスにドキュメントのパスとファイル名を入力します。
手順 2 と 3 を繰り返して、他のフレームの追加のドキュメントを開きます。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「ジャンプメニュー」ビヘイビアーの適用

挿入／フォーム／ジャンプメニューを使用してジャンプメニューを作成すると、Dreamweaver により、メニューオブジェクトが作成され、「ジャンプメニュー」ビヘイビアーまたは「ジャンプメニュー移動」ビヘイビアーがそのメニューオブジェクトに関連付けられます。通常、「ジャンプメニュー」ビヘイビアーをオブジェクトに手動で関連付ける必要はありません。

既存のジャンプメニューを次の 2 つの方法のいずれかを使用して編集できます。

ビヘイビアーパネルで既存の「ジャンプメニュー」ビヘイビアーをダブルクリックすると、メニュー項目の編集と再配置、ジャンプ先のファイルの変更、およびジャンプ先のファイルを開くウィンドウの変更を実行できます。
ジャンプメニューを選択して、プロパティインスペクターの「リスト値」ボタンを使用すると、あらゆるメニューで項目を編集するのと同じように、ジャンプメニューで項目を編集できます。

ドキュメントにジャンプメニューオブジェクトがまだない場合は、それを作成します。
オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「ジャンプメニュー」を選択します。
ジャンプメニューダイアログボックスで必要に応じて変更を加えて、「OK」をクリックします。

「ジャンプメニュー移動」ビヘイビアーの適用

「ジャンプメニュー移動」ビヘイビアーは、「ジャンプメニュー」ビヘイビアーと大きく関連しています。「ジャンプメニュー移動」によって、「移動」ボタンをジャンプメニューに関連付けることができます。このビヘイビアーを使用する前に、ドキュメントにジャンプメニューが既に存在している必要があります。「移動」ボタンをクリックすると、ジャンプメニューで選択したリンクが開きます。通常、ジャンプメニューに「移動」ボタンは必要ありません。ジャンプメニューから項目を選択すると、通常はそれ以上ユーザーが操作することなく、URL がロードされます。ただし、ビジターがジャンプメニューで既に選択されているのと同じ項目を選択すると、ジャンプは生じません。一般的に、この場合にジャンプが生じなくても問題はありません。ただし、ジャンプメニューが 1 つのフレームに表示され、ジャンプメニューの項目が他のフレームのページにリンクしている場合に、ビジターがジャンプメニューで既に選択されている項目を再度選択できるようにするには、「移動」ボタンが便利です。

注意：

ジャンプメニューで「移動」ボタンを使用する場合、メニューの選択内容に関連付けられた URL にユーザーをジャンプさせるメカニズムは、「移動」ボタンだけになります。ジャンプメニューでメニュー項目を選択しても、ユーザーが別のページまたはフレームに自動的にリダイレクトされることはなくなります。

「移動」ボタン（通常はボタンイメージ）として使用するオブジェクトを選択して、ビヘイビアーパネルのビヘイビアーの追加メニューからジャンプメニュー移動メニューを選択します。
ジャンプメニューを選択メニューで、「移動」ボタンでアクティブにするメニューを選択し、「OK」をクリックします。

「ブラウザーウィンドウを開く」ビヘイビアーの適用

「ブラウザーウィンドウを開く」ビヘイビアーを使用して、新規ウィンドウでページを開きます。サイズ、属性（サイズ変更可能かどうか、メニューバーがあるかなど）、名前などの新規ウィンドウのプロパティを指定できます。例えば、このビヘイビアーを使用して、ビジターがサムネールイメージをクリックしたときに別のウィンドウでより大きなイメージを開くことができます。また、このビヘイビアーを使用して、新規ウィンドウをイメージとちょうど同じサイズにすることができます。

ウィンドウに属性を指定しない場合、ウィンドウは、そのウィンドウを開いたウィンドウのサイズおよび属性を使用して開かれます。ウィンドウに属性を指定すると、明示的にオンにされていない他のすべての属性が自動的にオフになります。例えば、ウィンドウに属性を設定しない場合に、1024 × 768 ピクセルのウィンドウが、ナビゲーションバー（「戻る」、「次」、「ホーム」、「再読み込み」の各ボタンを表示）、ロケーションツールバー（URL を表示）、ステータスバー（下部にステータスメッセージを表示）、およびメニューバー（「ファイル」、「編集」、「表示」およびその他のメニューを表示）が表示された状態で開かれるとします。幅を 640、高さを 480 に明示的に設定し、他の属性は設定しない場合、640 × 480 ピクセルのウィンドウが、ツールバーが表示されない状態で開かれます。

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「ブラウザーウィンドウを開く」を選択します。
「参照」をクリックしてファイルを選択するか、表示する URL を入力します。
ウィンドウの幅と高さ（ピクセル単位）のオプションと、様々なツールバー、スクロールバー、サイズ変更ハンドルなどに関するオプションを設定します。ウィンドウをリンクのターゲットにしたり、JavaScript を使用してウィンドウを制御したりするには、スペースまたは特殊文字を使用せずに、そのウィンドウに名前を付ける必要があります。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「ポップアップメッセージ」ビヘイビアーの適用

「ポップアップメッセージ」ビヘイビアーを設定すると、指定したメッセージを示す JavaScript 警告が表示されます。JavaScript 警告には「OK」ボタンしかないため、このビヘイビアーは、ユーザーに対して選択肢を与えるためではなく、情報を提供するために使用します。

有効な JavaScript の関数呼び出し、プロパティ、グローバル変数、その他の式をテキストに埋め込むことができます。JavaScript 式を埋め込む場合は、波カッコ（{}）で囲みます。波カッコを表示するには、前にバックスラッシュを付けます（\{）。

例：

The URL for this page is {window.location}, and today is {new Date()}.

注意：

警告の外観はブラウザーによって制御されます。外観をより細かく制御するには、「ブラウザーウィンドウを開く」ビヘイビアーの使用をお勧めします。

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「ポップアップメッセージ」を選択します。
「メッセージ」テキストボックスにメッセージを入力します。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「イメージのプリロード」ビヘイビアーの適用

「プリロードイメージ」ビヘイビアーでは、ページが最初に表示されるときに表示されないイメージ（例えば、ビヘイビアーまたはスクリプトでスワップされるイメージ）をキャッシュに保存することにより、表示にかかる時間を短縮します。

注意：

「スワップイメージ」ビヘイビアーを使用し、スワップイメージダイアログボックスで「プリロードイメージ」オプションを選択すると、ハイライト表示されたイメージがすべて自動的にプリロードされます。そのため、「スワップイメージ」を使用する場合は、「プリロードイメージ」を手動で追加する必要はありません。

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「プリロードイメージ」を選択します。
「参照」をクリックしてイメージファイルを選択するか、「イメージソースファイル」テキストボックスにイメージのパスとファイル名を入力します。
ダイアログボックスの最上部にある「+」ボタンをクリックして、イメージのプリロードリストにイメージを追加します。
現在のページでプリロードする残りのイメージすべてに対して、手順 2 と 3 を繰り返します。
イメージのプリロードリストからイメージを削除するには、削除するイメージを選択して、「-」ボタンをクリックします。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「フレームテキストを設定」ビヘイビアーの適用

「フレームテキストを設定」ビヘイビアーを使用すると、フレームテキストを動的に設定できるので、フレームのコンテンツとフォーマットを、指定するコンテンツに置き換えることができます。コンテンツには、有効な HTML コードを含めることができます。このビヘイビアーを使用して、情報を動的に表示します。

「フレームテキストを設定」ビヘイビアーによってフレームのフォーマットが置き換わりますが、「背景色の固定」を選択すると、ページの背景色とテキストカラーの属性を維持することができます。

例：

The URL for this page is {window.location}, and today is {new Date()}.

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューからテキスト設定／フレームテキストを設定を選択します。
フレームテキストを設定ダイアログボックスのフレームメニューから、ターゲットフレームを選択します。
「現在の HTML を取得」ボタンをクリックして、ターゲットフレームの body セクションの現在のコンテンツをコピーします。
「新規 HTML」テキストボックスにメッセージを入力します。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「コンテナのテキストを設定」ビヘイビアーの適用

「コンテナのテキストを設定」ビヘイビアーを使用すると、ページの既存のコンテナのコンテンツとフォーマット（つまり、テキストまたはその他のエレメントを含めることができる任意のエレメント）が、指定するコンテンツに置き換わります。コンテンツには、有効な HTML ソースコードを含めることができます。

例：

The URL for this page is {window.location}, and today is {new Date()}.

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューからテキスト設定／コンテナのテキストを設定を選択します。
コンテナのテキストを設定ダイアログボックスのコンテナメニューを使用して、ターゲットエレメントを選択します。
「新規 HTML」テキストボックスに新規テキストまたは HTML を入力します。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「ステータスバーテキストを設定」ビヘイビアーの適用

「ステータスバーテキストを設定」ビヘイビアーを使用すると、ブラウザーウィンドウの左下隅のステータスバーにメッセージが表示されます。例えば、このビヘイビアーを使用すると、リンクに関連付けられている URL を表示する代わりに、ステータスバーにリンク先を記述できます。ビジターは通常、ステータスバーのメッセージを無視または見逃します。また、すべてのブラウザーが、ステータスバーのテキストの設定をフルサポートしているとは限りません。メッセージが重要な場合は、ポップアップメッセージまたは AP エレメントのテキストとして表示することをお勧めします。

注意：

Dreamweaver で「ステータスバーテキストを設定」ビヘイビアーを使用する場合、一部のブラウザーでは、ステータスバーのテキストを変更するときに特別な調整が必要なため、ブラウザーのステータスバーのテキストが変更されるという保証はありません。例えば、Firefox では「詳細オプション」を変更して、JavaScript でステータスバーのテキストを変更する必要があります。詳しくは、ご使用のブラウザーのマニュアルを参照してください。

例：

The URL for this page is {window.location}, and today is {new Date()}.

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューからテキスト設定／ステータスバーテキストを設定を選択します。
ステータスバーテキストを設定ダイアログボックスの「メッセージ」ボックスにメッセージを入力します。

メッセージは簡潔にします。ステータスバーに収まらないメッセージは切り捨てられます。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「テキストフィールドのテキストを設定」ビヘイビアーの適用

「テキストフィールドのテキストを設定」ビヘイビアーを使用すると、フォームのテキストフィールドのコンテンツが、指定するコンテンツに置き換わります。

例：

The URL for this page is {window.location}, and today is {new Date()}.

名前の付いたテキストフィールドの作成

挿入／フォーム／テキストフィールドを選択します。

Dreamweaver から form タグを追加するようプロンプトが表示されたら、「はい」をクリックします。
プロパティインスペクターで、テキストフィールドの名前を入力します。名前がページ上で固有であることを確認します。同じページ上では、たとえフォームが異なっても、複数のエレメントに同じ名前を使用しないでください。

「テキストフィールドのテキストを設定」の適用

テキストフィールドを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューからテキスト設定／テキストフィールドのテキストを設定を選択します。
テキストフィールドメニューからターゲットテキストフィールドを選択し、新しいテキストを入力します。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「エレメントの表示 - 非表示」ビヘイビアーの適用

「エレメントの表示 - 非表示」ビヘイビアーでは、複数のページエレメントを表示または非表示にしたり、表示か非表示かの初期設定を復元したりすることができます。このビヘイビアーは、ユーザーがページでインタラクティブな操作を行うとき、情報を表示するのに便利です。例えば、ユーザーが植物のイメージ上にマウスポインターを移動したときに、その植物の生育時期、生育地域、必要な日照量、育つ大きさなどの詳細を示すページエレメントが表示されるようにすることができます。ビヘイビアーは、関連するエレメントを表示または非表示にするだけです。非表示にする場合でも、ページのフローからエレメントが実際に削除されるわけではありません。

オブジェクトを選択し、ビヘイビアーパネルのビヘイビアーの追加メニューから「エレメントの表示 - 非表示」を選択します。

「エレメントの表示 - 非表示」を使用できない場合は、AP エレメントが選択されている可能性があります。どちらのバージョン 4.0 のブラウザーでも、AP エレメントではイベントが受け付けられません。このため、<body> タグまたはリンク（<a> タグ）のような別のオブジェクトを選択する必要があります。
エレメントリストから表示または非表示にするエレメントを選択し、「表示」、「非表示」、または「復元」（表示または非表示の初期設定を復元）をクリックします。
表示/非表示を変更する残りのエレメントすべてに対して、手順 2 を繰り返します。1 つのビヘイビアーを使用して、複数のエレメントの表示/非表示を変更できます。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

このビヘイビアーは Dreamweaver CS5 で非推奨になりました。

「スワップイメージ」ビヘイビアーの適用

「スワップイメージ」ビヘイビアーを使用すると、src 属性（<img> タグ）を変更することによって、あるイメージが別のイメージにスワップされます。このビヘイビアーを使用して、ボタンロールオーバー、その他のイメージ効果（複数のイメージを同時にスワップさせることなど）を作成します。ロールオーバーイメージを挿入すると、「スワップイメージ」ビヘイビアーが自動的にページに追加されます。

注意：

このビヘイビアーは src 属性にしか影響しないので、元のイメージと同じサイズ（高さと幅）を持つイメージとスワップするようにしてください。そうでない場合、スワップしたイメージが、元のイメージのサイズに合うように縮小または拡大されます。

「スワップイメージの復元」ビヘイビアーでは、最後にスワップされた一連のイメージが前のソースファイルに復元されます。「スワップイメージ」ビヘイビアーをオブジェクトに関連付けると、常にこのビヘイビアーが自動的に追加されます。「スワップイメージ」を関連付けるときに「復元」オプションを選択したままにすると、「スワップイメージの復元」ビヘイビアーを手動で選択する必要がなくなります。

挿入／イメージを選択するか、挿入パネルの「イメージ」ボタンをクリックしてイメージを挿入します。
プロパティインスペクターの左端にあるテキストボックスにイメージの名前を入力します。

イメージに名前を付けることは必須ではありません。ビヘイビアーをオブジェクトに関連付けると、自動的にイメージに名前が付けられます。ただし、前もってすべてのイメージに名前を付けておけば、スワップイメージダイアログボックスでイメージをより簡単に識別できます。
追加のイメージを挿入するには、手順 1 と 2 を繰り返します。
通常はスワップ対象のイメージであるオブジェクトを選択して、ビヘイビアーパネルのビヘイビアーの追加メニューから「スワップイメージ」を選択します。
イメージリストで、ソースを変更するイメージを選択します。
「参照」をクリックして新規イメージファイルを選択するか、「ソースの設定」テキストボックスに新規イメージのパスとファイル名を入力します。
変更する追加のイメージがある場合は、手順 5 と 6 を繰り返します。一度に変更するイメージすべてに対して、同じ「スワップイメージ」アクションを使用します。ただし、対応する「スワップイメージの復元」アクションは、それらすべてのイメージを復元しません。
「プリロードイメージ」オプションを選択すると、ページのロード時に新しいイメージがキャッシュに保存されます。

これにより、ダウンロード時にイメージの表示が遅れるのを防ぐことができます。
「OK」をクリックして、初期設定のイベントが正しいことを確認します。

「検査フォーム」ビヘイビアーの適用

「検査フォーム」ビヘイビアーを使用すると、特定のテキストフィールドのコンテンツがチェックされて、ユーザーが適切なタイプのデータを入力したかどうかが確認されます。ユーザーがフォームを記入する際にフィールドを検査する場合は、onBlur イベントを使用して各テキストフィールドにビヘイビアーを関連付け、ユーザーが「送信」ボタンをクリックしたときに複数のテキストフィールドを検査する場合は、onSubmit イベントを使用してフォームに関連付けます。このビヘイビアーをフォームに関連付けると、無効なデータが含まれるフォームは送信されなくなります。

挿入／フォームを選択するか、挿入パネルの「フォーム」ボタンをクリックしてフォームを挿入します。
挿入／フォーム／テキストフィールドを選択するか、挿入パネルの「テキストフィールド」ボタンをクリックしてテキストフィールドを挿入します。

追加のテキストフィールドを挿入するには、この手順を繰り返します。
検査方法を次の中から選択します。
- ユーザーがフォームを記入するときに個々のフィールドを検査するには、テキストフィールドを選択して、ウィンドウ／ビヘイビアーを選択します。
- ユーザーがフォームを送信するときに複数のフィールドを検査するには、ドキュメントウィンドウの左下隅にあるタグセレクターで <form> タグをクリックして、ウィンドウ／ビヘイビアーを選択します。
ビヘイビアーの追加メニューで「検査フォーム」を選択します。
次のいずれかの操作を実行します。
- 個々のフィールドを検査する場合は、ドキュメントウィンドウで選択したのと同じフィールドをフィールドリストで選択します。
- 複数のフィールドを検査する場合は、フィールドリストからテキストフィールドを選択します。
フィールドにデータを含める必要がある場合は、「必須」オプションを選択します。
次の「受諾」オプションのいずれかを選択します。

すべて

必須フィールドにデータが含まれているかどうかがチェックされます。データのタイプは任意です。

電子メールアドレス

フィールドに @ 記号が含まれているかどうかチェックされます。

数字

フィールドに数字だけが含まれているかどうかチェックされます。

数字の範囲

フィールドに特定の範囲の数字が含まれているかどうかチェックされます。
複数のフィールドを検査する場合、検査する追加のフィールドがあれば、手順 6 と 7 を繰り返します。
「OK」をクリックします。

ユーザーがフォームを送信するときに複数のフィールドを検査する場合、イベントメニューに onSubmit イベントが自動的に表示されます。
個々のフィールドを検査する場合、初期設定のイベントが onBlur または onChange であることを確認します。このいずれかでない場合、いずれかのイベントを選択します。

いずれのイベントでも、ユーザーがフィールドから移動したときに「検査フォーム」ビヘイビアーを実行します。違いは、onBlur はユーザーがフィールドに入力したかどうかに関係なく発生するのに対して、onChange はユーザーがフィールドのコンテンツを変更した場合にのみ発生するという点です。必須のフィールドでは、onBlur イベントの使用をお勧めします。

その他の関連ヘルプ

ヘルプをすばやく簡単に入手

新規ユーザーの場合

Adobe MAX Japan
クリエイターの祭典

2025 年 2 月 13 日
東京ビッグサイト

詳しく見る