問題タブ [material-design-lite]

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 投票する
2 に答える
5397 参照

javascript - Material Design Lite トグル スイッチの無効化

JavaScript を使用してページ上にいくつかの要素を作成し、それらを新しいMaterial Design Liteでドレスアップしようとしています。要素が作成された後、プログラムで要素の無効化を開始しようとするまで、すべて機能します。

トグル スイッチがいくつかあります (JavaScript で作成)。1つがオンになったら、他のものを無効にしたい。

私が使用する場合:

それはうまく機能し、無効になっていますが、次のように試してみるとすぐに:

toggle2 は視覚的にはまだアクティブです。波及効果は機能しますが、オンにスライドしないため、視覚的にではなくバックグラウンドで無効になっています。

例としてJSFiddleを次に示します(HTML要素を使用しますが、JSで作成したものでも同じことが起こります)

また、ここに問題のビデオがあります。その中で、3 番目のダウンは によって無効にされtoggle3.disabled = true;、4 番目のダウンは 2 番目のダウンの状態に基づいて IF ステートメントによって無効にされます。

何か間違っているのか、それとも MDL 自体のバグなのかはわかりません。

ありがとう

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

material-design-lite - mdl- layout__tab -bar のタグが実際のタグとして機能できるようにする

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

meteor - モバイル Web アプリに最適なフロントエンド フレームワーク

モバイル用のインタラクティブな Web アプリを開発しようとしていますが、できるだけ多くのモバイルに最高のエクスペリエンスを提供したいと考えています。

そのために、私は meteor を使用することにしました。これは、舞台裏のロジックに関するすべての重労働を処理するためです。ただし、そのような選択には代償が伴います。モバイルでは、プロセッサ、ネットワーク速度、等

そのため、可能な限り短い読み込み時間で最高のエクスペリエンスを提供できるように、非常に小さなフロントエンド フレームワークを選択しようとしています。

現在、pure.css、min.css、base、materialize、material design lite など、この問題に取り組むためのさまざまなソリューションがありますが、最適なソリューションを選択するのに苦労しています。

  • 機能の完全なセットが常に必要なわけではないため、サブセットを簡単に構築できるはずです
  • 最小のコスト (重量) で可能な限り最高のインターフェイスが欲しい
  • このパッケージは、古いブラウザーをうまく処理する必要があります (モバイルの世界は広大で激怒しています)。
  • 見栄えを良くするために、小さなやり取りを適切に処理する必要があります。
  • パッケージは、ほとんどの電話やネットワークでロード時間なしで優れたエクスペリエンスを維持するために、理想的には最大 14kb の重量にする必要があります (多かれ少なかれ!!!)

これまでのところ、マテリアル デザイン ライトが最高のコンテナーだと感じていますが、どう思いますか? カスタマイズは簡単ですか (ソーシャル アイコンの追加、使用されていないアイコンの削除、特定のアイコンへの効果の制限)。他のフレームワークはありますか? フレームワークなしで行き、地面からインターフェースを構築したほうがいいですか?努力する価値がありませんか?

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

material-design-lite - material-design-lite の「is-upgraded」クラスは何をし、どのように設定されていますか?

React アプリで Material-Design-lite を使用してマテリアル デザインを実装しています。トップコンポーネント内でフローティングラベル付きのTextFieldを使用している場合、機能します。しかし、最上位コンポーネントによって呼び出されたコンポーネントでは、そうではありません。TextField w/Floating Label は、通常の入力フィールドとして機能します。

外側の TextField は「is-upgraded」という名前のクラスを取得しますが、内側の TextField は取得しないことに気付きました。

アプリの構造

App.jsx

Products.jsx

myTest.jsx

index.html

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

material-design-lite - マテリアル デザイン ライト ナビゲーション

ナビゲーションにサブメニュー項目を作成するにはどうすればよいですか?

私はそれを使用<ul> <li>することはできません。正しいクラスは何ですか?

0 投票する
3 に答える
14757 参照

material-design-lite - テーブル付きマテリアル デザイン ライト グリッド

最近リリースされた MDL キットを試して、カードとテーブルでグリッド レイアウトを使用しようとしています。

私が見つけたのは、MDL グリッドは、ネストされた列の Bootstrap グリッドほど柔軟ではないということでした (おそらく、まだ十分にわかっていないからです)。そのため、私の 3 列のレイアウトでは、カードとテーブルを並べて使用して、持っているデータを表示しています。

残念ながら、手動で width=100% を適用しない限り、カードは列の幅全体には及びません。しかし、私がそれを行うとすぐに、テーブルは応答しなくなり、画面サイズが縮小すると周りのカードと重なります.

JSFiddle

この問題を解決する方法を誰か教えてください。

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

javascript - スワイプでナビゲーション ドロワーを開く (Material Design Lite)

Material Design Lite を使用して Web ビューでアプリの UI を作成していますが、スワイプでナビゲーション ドロワーをデプロイできないという問題に遭遇しました。

このjqueryコードを使用してスワイプイベントを認識しています

ここから、ナビゲーション ドロワーを開く方法がわかりません。画面全体、特に左端を「スワイプ可能」にすることをお勧めします。このスワイプ ハンドラーがトリガーされたときにナビゲーション バーを開くにはどうすればよいですか?

0 投票する
6 に答える
4210 参照

material-design-lite - 大画面でアイコンメニューを非表示にする方法は?

私はこれが初めてで、メニューアイコンを非表示にする方法を教えてください。プロンプトが表示されずに自動的に追加されます。小さな画面にのみ表示したい. 下手な英語でごめんなさい。

ありがとうございました。