問題タブ [zurb-joyride]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
148 参照

zurb-joyride - ジョイライドはレスポンシブですか?

私は最近ジョイライドをいじり始めました。素晴らしいです。ただし、いくつかの主要な対応の問題があります。ブラウザのサイズを変更すると、ヒントの位置が変わります。たとえば、元の位置が「上」の場合、ブラウザのサイズを変更すると突然「下」に変わります。

私はどこでも解決策を探しましたが、なぜこれが起こっているのかを見つけることができませんでした.

この問題が発生したり、回避方法を知っている人はいますか?

前もって感謝します!

0 投票する
1 に答える
151 参照

zurb-foundation-5 - cookie_monster true の場合、Zurb Foundation 5 Joyride の再起動

私のジョイライドはうまく機能します。ページのロード後に開始されます。停止ボタンをクリックするか、ツアーを終了すると停止します。私の再起動リンクは、ジョイライド ツアーを再開します。それだけ...

Joyride 設定を追加すると、cookie_monster: true訪問のたびにツアーが再開されなくなります。良い!残念ながら、再起動リンクが機能しなくなります。動作は理にかなっています。start 関数は、ページの読み込み時に呼び出されたのか、リンクから呼び出されたのかわかりません。リンクは他の方法を使用するか、Cookie チェックをバイパスするように設定する必要があります。

cookie_monster初回のみ表示するデバイスによって非表示になった後、ユーザーがジョイライドを開始できるようにする魔法を知っていますか?

本文のマークアップ:

Javascript:

0 投票する
0 に答える
63 参照

anchor - 特定のジョイライド ツールチップへのリンク

joyride.js を使用して、いくつかのツールチップを含むページを作成しました。

別のページから特定のジョイライド ツールチップにリンクする方法はありますか? ありがとう

0 投票する
1 に答える
255 参照

wordpress - バックエンド ツアーの Wordpress Joyride

wordpress(最新)とFoundation Pressテーマ(最新)のクリーンコピーをインストールしました。管理エリアで Joyride を実行して、クライアントの基本情報を表示することは可能ですか? その場合、そのプロセスをどのように開始しますか?

更新:これを使用してプラグインを作成しようとしていますが、スクリプトが読み込まれず、このようにキューに入れています。初期化を別のjsファイルに追加しました。

}

0 投票する
1 に答える
303 参照

javascript - Chrome 拡張コンテンツ スクリプトから、iFrame で Zurb Foundation の Joyride をアクティブ化する

HTMLページ(つまり、ブラウザウィンドウで表示されているページ)内にiFrameを作成するChrome拡張機能を構築しています。

iFrame は、Chrome 拡張機能のコンテンツ スクリプトによって HTML ページに「挿入」されます。結果の HTML は次のようになります。

コンテンツ スクリプトは、iFrame をメイン ページの DOM に追加した後、独自の DOM を操作して iframe にコンテンツを入力します。Zurb CSS を使用して、iframe コンテンツのスタイルを設定します。

そして、これはすべて正常に機能します。

私は今、Zurb Joyride を iframe のコンテンツに追加しようとしていますが、これで作業できません。

私のマニフェストの content_scripts 宣言は次のようになります。

iframe 自体が Zurb スクリプトにアクセスする必要があると思われるため、foundation.min.js が拡張機能の一部としてマニフェストによって読み込まれるだけでなく、コンテンツ スクリプトも iframe 内に関連するタグを追加します (DOM を操作することによって) )。私の理解では、iframe 内の重要な要素は次のとおりです。

  • Zurb JS ファイルのタグ
  • ジョイライドをアタッチするオブジェクト (id="testjoyride")
  • お遊びコンテンツそのもの
  • foundation() への初期化呼び出し

したがって、これを念頭に置いて、マニフェストの web_accessible_resources 宣言は次のようになります。

次に、コンテンツ スクリプトを使用して、iframe 内に次の HTML を作成します。

そして最後に、上記のすべてのコンテンツが iframe にアタッチされたら (もちろん、iframe は親ページの DOM にアタッチされます)、content_script からfoundation() を呼び出します。

次のように呼び出す必要があると思います: $(window.frames.myIframe.contentWindow.document).foundation('joyride', 'start');

つまり、親ページではなくiframeのドキュメント オブジェクトを渡します **

だから私はそれをすべてやりますが、何も起こりません。ジョイライドは表示されず、HTML は自動生成された出力に変換されません (ここで説明されているように)。

単純な HTML ページでテスト ケースを作成しましたが、うまくいきました。そのテスト ページを iframe に移動しようとすると、ジョイライドが機能しなくなりました。したがって、自信はありませんが、問題は Chrome 拡張機能ではなく iframe にあるのではないかと思います。

** 注: すべての DOM 操作の最後にこの呼び出しを配置し​​ます。作成した新しい HTML を iframe の DOM に追加した後、すべてのリスナーなどを作成した後、その時点までにスクリプトとジョイライドが「そこにある」はずです。ただし、foundation('joyride','start') への呼び出しの直前に alert() を貼り付けると、アラートの背後に空の iframe が表示され、アラートを閉じた後にのみ iframe が読み込まれます。それが重要なのか、アラートの奇妙な効果なのか、私にはわかりません。