1. ホーム
  2. 使い方 Blocs
  3. インタラクションマネージャー
  1. ホーム
  2. ページ
  3. インタラクションマネージャー

インタラクションマネージャー

インタラクション マネージャーを使用すると、追加のコードを必要とせずに、Web サイトの機能を拡張するカスタム インタラクションを作成できます。これらのカスタム インタラクションは、事前設定されたルールを組み合わせて作成され、機能に無限の可能性を提供します。

ルールを材料として考えてみましょう。さまざまな方法で組み合わせることで、さまざまな結果を生み出すことができます。

インタラクションマネージャで作成できるものの例のチュートリアルは、 Blocs アカデミー.

インタラクションマネージャーを開く

インタラクションマネージャーを起動するには、 メインメニューバー とから Windows メニューを選択 インタラクションマネージャー または、キーボードショートカットを使用します ⌃⌘i.

インタラクションを追加

新しいインタラクションを作成するには、 + インタラクションマネージャウィンドウの右上隅にあるボタンをクリックするか、キーボードショートカットを使用します。 ⌃n.

インタラクションの名前を変更する

インタラクション項目のテキストをクリックして新しい名前を入力するだけで、インタラクションの名前を変更できます。

重複したインタラクション

やり取りを複製するには、 右クリック そして、 複製 コンテキストメニューから、またはキーボードショートカットを使用して ⌘+ D.

インタラクションを削除

カスタムインタラクションを削除するには、削除したいインタラクション項目を選択して、 ボタンをクリックするか、キーボードショートカットを使用します。 ⌘+⌫.

編集インタラクション

インタラクションを編集するには、 設定 インタラクション アイテムの右端にあるボタンをクリックするか、インタラクション アイテムをダブルクリックします。これにより、インタラクション内に含まれるすべてのルールを含むポップオーバーが開きます。

ルールを挿入

インタラクションに新しいルールを挿入するには、 + インタラクションポップオーバーの右上にあるボタンをクリックするか、キーボードショートカットを使用します。 ⌃n. これにより、カスタム インタラクション内で使用できるすべての利用可能なルールを含むドロップダウン メニューが開きます。 いずれかをクリックすると、現在選択されているルールの下に挿入されます。

Ifステートメント

if ステートメント ルールは、条件付きロジックを実行するために使用されます。これにより、指定された条件が true と評価された場合にのみトリガーされるルールを配置できます。これは、カスタム インタラクションでの意思決定に役立ち、特定の条件に基づいて異なる結果を可能にします。

カスタム インタラクションの if ステートメントは、URL、表示、画面上、スクロール Y、Cookie、オペレーティング システム (OS)、時間範囲、昼間、夜間、日付、曜日、月、平日、週末の変数をサポートします。すべての変数で比較値を指定でき、さまざまな演算子をサポートします。

このルールはブラウザを指定されたページに移動します。

このルールはブラウザを指定された URL に移動します。

ページをリロードする

このルールはブラウザの現在のページを再読み込みします。

ターゲットまでスクロール

このルールは、指定された #ID を持つ要素までスクロールします。

可視性の切り替え

このルールは、指定された #ID を持つ要素の表示を切り替えます。

トグルモーダル

このルールは、指定された #ID でモーダル (表示/非表示) を切り替えます。

クラスの切り替え

このルールは、指定された #ID を持つ要素の指定されたクラスを切り替えます。

クラスを追加

このルールは、指定された #ID を持つ要素に指定されたクラスを追加します。

クラスを削除

このルールは、指定された #ID を持つ要素から指定されたクラスを削除します。

属性の設定

このルールは、指定された #ID を持つ要素のデータ属性の値を設定します。

テキストの設定

このルールは、指定された #ID を持つ要素に指定されたテキスト コンテンツを設定します。

タブを選択

このルールは、指定された #ID を持つタブ Bric のタブを選択します。

アイテムをクリック

このルールは、指定された #ID を持つ要素をプログラムでクリックします。

テキストをコピーする

このルールは、指定されたテキスト文字列または要素のテキスト コンテンツをユーザーのペーストボードにコピーします。

要素を削除

このルールは、指定された #ID を持つ要素を削除します。

このルールは、指定された電話番号への通話(サポートされているデバイス上)を開始します。

このルールは、現在のユーザーの電子メール クライアントを開き、アドレス フィールドに指定された電子メール アドレスが入力されます。

ダウンロードファイル

このルールは、指定されたファイルのダウンロードをトリガーします。

ビデオプレーヤー

このルールは、指定された ID を持つビデオ プレーヤー要素の再生、一時停止、停止、ミュートなどのイベントをトリガーできます。

オーディオプレーヤー

このルールは、指定された ID を持つオーディオ プレーヤー要素の再生、一時停止、停止、ミュートなどのイベントをトリガーできます。

サウンドを再生します

このルールは、割り当てられた mp3 オーディオ ファイルを再生します (アセット マネージャーにオーディオ ファイルを追加します)。

このルールは、指定された名前、値、日数でユーザーのブラウザに Cookie を設定します。

このルールは、指定された名前のユーザーのブラウザ内の Cookie を破棄します。

カスタムインタラクションを呼び出す

このルールは別のカスタムインタラクションを呼び出し、ミリ秒単位で設定された遅延を許可します。

一時停止インタラクション

このルールは、次のインタラクション ルールが実行される前に遅延 (ミリ秒単位) を追加します。

対話を停止

このルールにより、カスタム インタラクションではその後に追加のルールが実行されなくなります。

コンソールログ

このルールは、指定されたテキストを含むブラウザ ログを作成します。

警告

このルールは、指定されたメッセージでアラートをトリガーします。

このルールにより、現在のページの印刷オプションが開きます。

読み込みを停止

このルールは、Web ブラウザの読み込みを停止します。

ルールを複製する

ルールを複製するには、 右クリック そして、 複製 コンテキストメニューから、またはキーボードショートカットを使用して ⌘+ D.

ルールを削除する

インタラクションからルールを削除するには、削除したいルールを選択して インタラクション ポップオーバーの右上にあるボタン。

If 文内に配置

複数のルールをif文の中に素早く配置するには、ルールを選択して右クリックし、 場所内 > Ifステートメント コンテキストメニューから選択します。

データショートコード

これで、 データ() カスタムインタラクションのショートコードを使用してカスタム データ属性 インタラクションの実行時にトリガー要素から値を取得します。次のように、ターゲット データ属性を括弧内に配置するだけです。 データ(私の属性)。 属性 しなければなりません トリガー要素にも保存されます。

あなたが使用することができます データ() 任意のインタラクションルールテキストフィールドのショートコード。要素にカスタムデータ属性を追加する方法の詳細 こちら.

カスタムインタラクションを適用する

カスタムインタラクションは、ほぼすべての要素に適用できます。 Blocs、などの項目 ボタン, 画像アイコン 標準のサイドバーインタラクションドロップダウンで、カスタムインタラクションオプションを利用できるようになります。

その他の要素としては、 Blocs, , コラム, div클라우드 기반 AI/ML및 고성능 컴퓨팅을 통한 디지털 트윈의 기초 – Edward Hsu, Rescale CPO 많은 엔지니어링 중심 기업에게 클라우드는 R&D디지털 전환의 첫 단계일 뿐입니다. 클라우드 자원을 활용해 엔지니어링 팀의 제약을 해결하는 단계를 넘어, 시뮬레이션 운영을 통합하고 최적화하며, 궁극적으로는 모델 기반의 협업과 의사 결정을 지원하여 신제품을 결정할 때 데이터 기반 엔지니어링을 적용하고자 합니다. Rescale은 이러한 혁신을 돕기 위해 컴퓨팅 추천 엔진, 통합 데이터 패브릭, 메타데이터 관리 등을 개발하고 있습니다. 이번 자리를 빌려 비즈니스 경쟁력 제고를 위한 디지털 트윈 및 디지털 스레드 전략 개발 방법에 대한 인사이트를 나누고자 합니다. サイドバーインスペクターにカスタムインタラクションペインが表示されます。

この メニューマネージャー メニュー項目でカスタムインタラクションを使用するためのサポートがあります。

カスタムインタラクションをトリガーする

ほとんどの場合、カスタムインタラクションは3つの方法でトリガーされます。要素が クリックしたマウスカーソルが ホバリング 要素の上にマウスカーソルを置いたとき 要素。

ページが完成したらカスタムインタラクションをトリガーすることもできます。 ロードされました、これは ページ設定オプション。

専門家のヒント

インタラクションマネージャからカスタムインタラクションをドラッグして、 Blocs デザイン キャンバスで適用します。また、ページ ナビゲータでページにカスタム インタラクションをドラッグして、ページ読み込みカスタム インタラクションを適用することもできます。

10年2025月XNUMX日に更新

この記事は役に立ちましたか?

関連記事