問題タブ [jquery-ui-tabs]

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 に答える
1148 参照

javascript - Javascript スクロール メニュー - 最初の接触時に MouseOver 選択が正しく機能しない

現在、自動的に循環するタブ メニューを使用しています。タブの1つにマウスオーバーすると、選択したタブで「回転」が停止し、マウスアウトすると、選択したタブ項目から回転し続けます。

現時点では、MouseOver サイクルが停止しても正しい項目が選択されていません。一度 mouseOut を行ってから MouseOver を再度実行すると、機能は完全に機能します。私の問題は、最初のマウスオーバーでコードが正しくロードされていないように見える場所にありますか?

何か案は?助けていただければ幸いです。

お時間をいただきありがとうございました..

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

javascript - jqueryタブをページ全体に展開する方法

次のようなページがあります。

4つのタブを持つjQueryタブ要素があります。ページ全体で 4 つのタブすべてを同時に表示し、閉じるオプションを使用して元の状態に戻す 1 つのボタンが必要です。このようなもの:

これを行う方法について何か考えはありますか?

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

jquery - IE 7 および 8 で JQuery の追加を機能させるにはどうすればよいですか?

これは私のコードです:

divHtml に html li タグがある場所

FF と chrome では正常に動作しますが、IE7 と 8 では動作しません :(

このサイトで利用可能な多くの代替手段を試しましたが、喜びはありません!

助けてください

0 投票する
8 に答える
22430 参照

javascript - jqueryuiタブの主要なスタイル変更

jquery UIタブを使用していますが、スタイルを大幅に変更する必要があります。背景画像、境界線、ほとんどすべてを表示する必要があります。私はそれが最小限に見える必要があり、それが自己完結しているようではありません。

これを行うための最良の方法は何ですか?ただし、同じページにあるカレンダーウィジェットのデフォルトのUIスタイルを使用する必要があります。私はたくさんの研究をしました、そして誰もがテーマローラーを指しているようです。ただし、色や境界線の半径を変更したいだけではありません。がらくたを削除する必要があります。テーマローラーは、色などを変更するだけのようです(現実の世界ではあまり役に立ちません)。同じページの他のUIウィジェットのスタイルを変更せずにタブにCSSを適応させるにはどうすればよいですか(カレンダーをそのままにしておきたい)?

タブにjqueryUIを使用する価値はありますか?

0 投票する
2 に答える
2861 参照

jquery - 多くのタブの jQuery UI タブのカスタマイズ

HootSuite のように動作するようにカスタマイズされた jquery-ui-tabs を使用してタブ バーを実装したいと思います。HootSuite でこれを試してみて、私が何を意味するかを確認してください。

  1. hootsuite.com アカウントにログインします。
  2. タブの右側にある + 記号をクリックします
  3. 「その他...」タブが表示されるまで、「MMMMMMMMMMMMMMMMM」という名前のタブを追加します。

これが表示されます: hootsuite タブ バー オーバーフロー http://issues.tauren.com/hootsuite-sample.png

HootSuite には次の機能が含まれており、そのすべてを実現したいと考えています。

  1. できるだけ多くのタブを画面に収めます。画面が大きいユーザーには、より多くのタブが表示されます。
  2. スペースがなくなると、[その他...] タブにドロップダウン リストが表示されます。
  3. [その他] タブをクリックすると、追加のタブのリストがドロップダウンします。
  4. タブはドラッグして並べ替えることができます。
  5. [その他] ドロップダウン リストのタブをタブ バーにドラッグできます
  6. タブ名の横に小さな X があるタブを削除します
  7. 最後のタブの右側に + アイコンが付いたタブを追加します

私はすでに 4 と 6 を実行するタブ バーを使用しています。非常にクールなPaging Tab Pluginを見つけましたが、動作が異なります。上記を達成するのに役立つプラグインやテクニックを知っている人はいますか?

私の考えでは、[その他] タブを実際のタブにするのではなく、単にタブのように見えるオブジェクトにします。別のタブが収まるかどうかを計算するロジックを tabs.add メソッドに追加します。それができない場合は、タブの詳細を別の「その他」リストに追加します。これをすべて機能させるにはかなりの労力が必要になるため、役立つプラグインがあればぜひ教えてください。

ところで、さらに調べてみると、HootSuite はこのために UI タブを使用しているようには見えません。これを行う jquery プラグインが既にある場合は、自作ソリューションの作成を避けたいと思います。


更新: 私はこれにもう少し時間を費やしましたが、現在、私のカスタム ソリューションは 1、4、6、および 7 を実行しています。ただし、スペースが不足すると、デフォルトの ui-tabs の動作が発生し、2 行目のタブが表示されます。 . また、hootsuite のようなソリューションを構築する時間が見つかるまで、使用できる別のスクロール ソリューションも見つけました。それでも、誰かが他の同様のプラグインを知っているなら、私に知らせてください!

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

jquery - jQueryタブによってロードされたコンテンツページで定義された関数を呼び出す

jQueryタブによってAjaxコンテンツとしてロードされているページに実装されている場合とされていない場合があるコールバックメソッドを呼び出したい。つまり、JSPファイルでレンダリングされたコンテンツをロードする一連のjQueryタブがあります。これらのファイルの中には、追加のAjaxコンテンツが含まれているものと、含まれていないものがあります。

私にできることは次のとおりです。

ただし、これにはいくつかの欠点があります。すべてのコールバックは、メインのタブページに埋め込まれたスクリプトで宣言する必要があります。また、依存する可能性のあるものはすべて、エレガントではありません。また、ページごとのif / elseステートメントを回避するために、同じコールバックを呼び出せるようにしたいと思います。要するに、私は次のようなものが欲しいです

残念ながら、コンテンツで宣言されているスクリプト関数を呼び出す方法がわかりませんでした。他のスレッドで述べられているように、JavascriptはjQueryによってロードされません。

どうやらこれにはオプションを設定する必要がありますが、どれかわかりませんでした。

オプションが設定され、JSがロードされた場合、どのように機能にアクセスしますか?ui.panel.funcname();になりますか??

ありがとう、ES

0 投票する
4 に答える
19098 参照

javascript - JQuery UI タブ: 別のページからタブに直接移動するにはどうすればよいですか?

JQuery UI タブは、順序付けられていないリストの名前付きアンカーによって実装されます。タブの 1 つにカーソルを合わせると、ブラウザの下部に表示されるリンクに次のように表示されます。

上の例は「注文」タブです。JQuery は明らかにこのアンカーへのクリックをインターセプトし、代わりにタブを開きます。

ただし、上記のリンクをブックマークするか、サイトの他の場所からリンクすると、特定のタブでページが開きません。

タブの初期化ブロックでは、URL で名前付きアンカーを検索し、見つかった場合はタブのインデックス ルックアップを実行し、その上で選択を呼び出すコードを入れることを検討していました。これは、JS をオフにしても機能することを意味します。

しかし、もっと簡単/より良い/より良い方法はありますか?

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

jquery - jQueryUI タブ内に jsTree を作成できません

jQuery UI タブ内に jsTree を作成できません。タブの外に jsTree を作成すると、正常に動作します。jsTree が jQuery UI タブと互換性がないかどうかは誰にもわかりませんか?

私のページは以下です。次の行を置き換えると

と:

次に、タブ コントロールの下のページにツリーが正常に読み込まれます。


tab3.html の内容は次のとおりです。

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

jquery - JQuery UI タブのコンテンツ パネルの高さ

JQuery UIのタブ付きパネルでコンテンツ領域の高さを取得するにはどうすればよいですか? $('.ui-tabs-panel').height()は、コンテンツ領域の高さ + タブの高さを明確に返します。この次元を取得する簡単な方法があるに違いないと思いますか? これまでのところ、オンラインで検索してもその答えは出ていません。

どんな提案でも大歓迎です!

クリス

0 投票する
2 に答える
4047 参照

jquery - JQuery UI タブ - タブとコンテンツを置き換える

現在選択されているタブとその内容を置き換える最良の方法は何ですか? コンテンツは URL 経由ではなく、jquery で動的に生成されます。

タブ コードまたはタブ イベント ハンドラ (表示、追加など) の外部からこれを行う必要があります。ページの別の場所にリンクがあり、クリックすると次のようになります。

  • タブのタイトルを変更する
  • タブのクラス名を変更する
  • tabcontent div のすべての要素を消去します
  • tabcontent div の className を変更します
  • tabcontent div 内に新しいコンテンツを生成する

このリンクの click() ハンドラーが持つ唯一の参照は、JQuery タブ オブジェクト ($Tabs) への参照であることに注意してください。で選択したタブを取得できます$Tabs.tabs('option','selected')。しかし、選択したタブのタブとパネルへの参照を取得するにはどうすればよいですか? jquery のタブ ハンドラ (show、add など) 内で、ui.tabandui.panelにアクセスできますが、タブ オプションからそれらを取得する方法はありますか?

現在選択されているタブを単純に削除してから、同じインデックスの場所に新しいタブを追加する方がよいでしょうか? タブのコンテンツを生成するコードを add() ハンドラーに入れる必要があると思います。

編集:誰も提案がないことに驚いています。現在選択されているタブを削除してから、同じ場所に新しいタブを追加することで機能しています。高速なブラウザでは、これは適切な解決策ですが、JavaScript が遅いブラウザでは、実際にタブが消えてから新しいタブが表示されます。動作しますが、実際には最適ではありません。