問題タブ [jquery-ui-progressbar]

jQuery UI タブを使用してコンテンツ スライダーを作成したい (「回転」オプションを有効にし、タブ コンテンツをフェードイン/フェードアウトするいくつかの fx を使用)。さらに、jQuery UI Progressbar をタブに統合して、タブが表示されている間にアニメーション化するようにしたいと考えています。

私はここで例を作りました: http://jsfiddle.net/xwXRa/9/

誰でもそれを行う方法について何か考えがありますか? 何かを試しましたが、タブ選択で各プログレスバーを無効/有効にする方法がわかりません。

ありがとう、エイドリアン

jQuery UI プログレスバーのデフォルトの方向は左から右です。完了時に右から左に移動するように変更するにはどうすればよいですか? 以下は、私が達成しようとしているものの例です。

これは jQuery UI と Javascript に関する非常に単純な質問かもしれませんが、私はまだこれらの構文について自分のやり方を感じています。C# (ASP.NET) プログラムがさまざまな関数で特定のポイントに到達するたびに、jQuery の進行状況バーを更新しようとしています。私はこれを正しくやっていますか？ページに空の進行状況バーが表示されますが、進行状況を更新できません。

ここに私のスクリプトがあります：

ここに私のスクリプト参照のいくつかがあります：

ここでは、C# 関数を介して updateProgress() 関数を使用しようとしています。プログレス バーに「10%」を送信しようとしていますが、デバッガーでエラーが発生し、updateProgress() が定義されていないと表示されます。

編集:次のブール値を追加して、ページの更新と進行状況バーの更新をバイパスしました。

私はそれが働いているとは思わない。ページが読み込まれるたびにクリアされ、ゼロに戻されます。

私はアプリに jQuery UI の完全なコピーを持っているので、CDN からロードしているのか、ローカルでロードしているのかは問題ではありません。(CDN から読み込む場合、唯一のオプションはライブ バージョンにモンキー パッチを適用することです。そうですか?)

残念ながら、設定可能なオプションではありません（対照的に）。私は私のケースに入る必要があります（そして、はい、アプリケーション全体です。チーム内でこれについて話し合っており、jQueryの決定の理由を理解しています。それ以外の場合はそれが必要なだけです）、私の唯一のオプションはmonkeypatchすることのようですプロトタイプまたは独自のプラグインを維持します。また、jQuery UI オブジェクトをロードするために、現在「ウィジェット」アーキテクチャを使用していることもわかりました。this.minthis.options.maxthis.min-1

この特定のアプリケーションでは、私のスクリプトは大まかに次のようにロードされます。

だから私は company.utils.js に入り、そのようにmonkeypatchを定義することを考えています:

ただし、これがこのオブジェクトにモンキーパッチを適用する正しい方法であるかどうかに興味があります。確かにそうかもしれませんが、より広い StackOverflow コミュニティに尋ねて、将来の検索者のために何かグーグルで検索できるものを提供しようと思いました。

ページの読み込み時にアニメーションのプログレスバーを作成する必要があります。必要なものの例を次に示します。http： //somnia-themes.com/templates/verendus/shortcodes/progressbar.html

上記の例と同じ量のバーを表示する必要がありますが、ストライプ画像でアニメーション化する必要があります。CSSを使用できますが、すべてのブラウザーで機能することを確認する必要があるため、スライスしたストライプ画像を使用します。

どんな援助にも感謝するでしょう。

または、Twitter Bootstrapに使用できるアニメーションのプログレスバーがあります（私のサイトはBootstrapフレームワークで構築されています）が、バーは上記のURLと同じように読み込まれません。この読み込み機能をBootstrapに追加する方法はありますか？

前もって感謝します。Sanj

私は問題があります。

プログレスバーが100に達したときに最初からやり直すように、誰かがこのコードを修正するのを手伝ってくれますか.

作業が進行中であることを確認していただければ幸いです。私のコードでは、100 に達すると停止します。

私の質問を理解していただければ幸いです。

別の解決策は、常にさまざまな値でジャンプするプログレスバーです。唯一重要なことは、ページからリダイレクトされるまでプログレスバーが常に機能していることです。

現時点での私のプログレスバーのコードは次のとおりです。

Rails アプリケーションで jQuery UI の不確定プログレスバーを適切に機能させるのに問題があります。私は、http://jqueryui.com/progressbar/#indeterminateにある jQuery-UI API デモに基づいて作業を行っており、これをアプリケーションに適応させようとしています。

エミュレートしようとしている jQuery サンプル コードの重要な部分は次のとおりです。

Rails アプリの主要なコードは次のとおりです。

アプリケーション.js:

ページ固有の JS (event.js) - views/events/new.html.erb に含まれています:

アプリケーション.css:

events.css.scss:

ビュー/イベント/new.html.erb:

提供されたページの結果の HTML:

このコードは、jQuery デモの灰色のアニメーション バーではなく、progressbar div に空白の白いバーを生成します。document.ready 関数のコメントを削除すると、バーは赤 (#aa0000) に変わりますが、まだアニメーション化されておらず、静的です。この振る舞いについて誰かが持っている洞察をいただければ幸いです。

更新: 次のスレッドを見つけました - https://forum.jquery.com/topic/progressbar-api-redesign#14737000003912014 - アニメーション オーバーレイ GIF ファイルがまだテーマ パッケージに含まれていないことを示唆しているので、ダウンロードしましたassets/images/animated-overlay.gif にインストールしましたが、それでも機能しません。Smoothness テーマの CSS ファイルに次の行が見つかりました。

だから私は画像を正しい場所に置いていると思います。助言がありますか？

プログレスバーのこのコードがありますが、.progress-label(2.020302032400%) のように小数点以下が多すぎます。

私のコードは次のようになります

どうすれば小数をなくすことができますか? また、パーセンテージを 1 ずつ増やすことは可能ですか? 今は速すぎます。

- - - - - - - - - - - - - - - - - -編集 - - - - - - - ----------------------

バーマーの回答でコードを完成させました。誰かがここで解決策を必要とする場合は、次のとおりです。

非常に大きな json ファイルを読み込んでいるときに、jQueryUI プログレス バーを使用したいと考えています。getJSON() を呼び出すときにファイル内の「レコード」の数がわかっているので、それに応じて進行状況バーを進めることができますか?