に質問検索_PHP中国語ウェブサイト

コミュニティ学ぶツールライブラリレジャー

日本語

人気の検索：
PHP
MySQL
jquery
HTML
CSS

影付きクローンバージョンでメニューボタンをX字型に変形させるホバーエフェクトを作成します

まず初めに、タイトルが紛らわしいことを認めたいと思います。申し訳ありません。私が達成したいのは、ホバー時の次の効果です。私のウェブサイトはここです https://wordpress-493302-3130963.cloudwaysapps.com/ CSS トランジションを使用して達成したいことの半分は正常に達成されましたが、シャドウが表示されません上の画像に示されている作成ボタンのコピー。私のCSSは次のとおりです。cta-button-menu:hover{transform:rotateZ(45deg)

P粉546257913 2024-04-04 11:55:21

JavaScript - このストロークのアニメーション効果はどのようにして実現されるのでしょうか?

このストロークのような効果は、マウスをその上に置くと表示されますが、純粋な CSS で実現できますか?同じ効果を達成するにはどうすればよいでしょうか?

学习ing 2017-06-24 09:44:08

CSS 表示プロパティのグラデーション効果

私は現在、CSS の「スーパードロップダウン」を設計しています。基本的には通常の純粋な CSS ドロップダウンですが、その中にはさまざまな種類のコンテンツが含まれています。現在、CSS3 トランジション効果は「display」プロパティには適用されないようです。つまり、display:none から display:block (または任意の組み合わせ) にトランジションする方法がありません。上の例では、誰かが一番上のメニュー項目にカーソルを置いたときに、2 番目のレベルのメニューを「フェードイン」させる方法はありますか? Visibility: 属性でトランジション効果を使用できることはわ...

P粉608647033 2023-08-21 11:08:32

vue および vuetify コンポーネントに対するマウスオーバー効果

そこで、次の記事の例に示すようにマウスオーバー効果を再作成しようとしました: https://blog.prototypr.io/stunning-hover-events-with-css-variables-f855e7b95330 しかし、私の場合は Vue を使用したいと考えています。 vuetify ライブラリから v-card にホバー効果を適用する .js。これが私の試みです: https://codepen.io/pokepim/pen/NWdwOEq

P粉032649413 2024-03-27 16:31:16

ナビゲーションバーのホバー効果を実装する方法

垂直ナビゲーションバーを作成中です。そのアイコンの名前が右側に表示されるはずです。また、マウスをアイコンの上に置くと名前が白から黒に変わるはずですが、機能しません。それが役立つかどうかを確認するためにタグを変更してみました。また、HTML のタグを変更し、CSS のタグも変更してタグが機能するようにしました。このサイトで問題の解決策を探しました。ナビゲーションバーが機能しません。ここにコードを置く方法がわかりません。お役に立てれば、メッセージ経由でコードを送信させていただきます。理解するのに30分以上費やした

P粉041758700 2024-01-10 18:06:56

メニュー項目のホバー効果はページの高さ全体をカバーします

左側のナビゲーションを開発しています。カーソルを合わせるとメニュー項目の前に赤いバーが表示されるようにしたいです。これは「ホーム」項目とそのサブ項目では機能しますが、他のルート項目ではホバー時に赤いバーがページの上から下まで幅全体に表示されます。 $(document).foundation();.vertical.dropdown.menu[href]>i{display:block;}.vertical.dropdown.menu[href]{display:block;text-ali

P粉029327711 2024-02-04 00:36:46

CSS 表示プロパティの変換

私は現在、CSS の「メガドロップダウン」メニューを設計しています。基本的には通常の純粋な CSS ドロップダウンメニューですが、さまざまなタイプのコンテンツが含まれています。現在、CSS3 トランジションは「display」プロパティでは動作しないようです。つまり、display:none から display:block (または任意の組み合わせ) に移行することはできません。誰かがトップレベルのメニュー項目の 1 つにカーソルを置いたときに、上の例の 2 番目のレベルのメニューを「フェードイン」させる方法はありますか? Visibility: 属性で変換を使用できることはわかっていま...

P粉958986070 2023-08-23 12:27:32

JavaScript - better-scroll +vue スクロールの使い方を教えてください

こんな感じですベタースクロールコンポーネントは縦スクロール方式を使用しますが、横スクロールについてはずっと研究していて実装できていませんので、アドバイスをいただければ幸いです。達成したいのは、水平メニューを私がマークしたメニューと同様にできることです

三叔 2017-07-05 10:44:28

:hover 効果を複数の要素に動的に追加する

プログラムで複数の要素にホバー効果を追加することはできますか?私たちのシステムでは、単一のユニットを表す複数の要素が存在します (ただし、他の理由で複数の要素に分ける必要があります)。場合によっては、ホバー時に一緒に色を変更する必要があります。プログラムで複数の要素にホバー効果を追加することは可能ですか?それともこれは良い習慣なのでしょうか？ my_own_css_class を使用し、ホバー時にすべての要素に追加することで、この問題を解決できました。しかし、プログラムでホバー効果を持たせるとうまくいくかもしれないと感じています

P粉203792468 2023-08-15 23:49:58

ReactJS: ホバー時のドロップダウンメニューアイコンを動的に更新する

まず、ReactJS を練習するために、「antd」React フレームワークと tailwindCSS を使用しました。さて、このフレームワークを使用するのは初めてです。そこで、まずホバー時のドロップダウンポップアップを使用してみることにしました。実際のところ、この段階に到達する方法は完全には明らかではありません。もちろん、CSS を使用して「hover:」属性を使用できることは知っていますが、ReactJS でロジックを使用するアイデアはありますか?また、小道具「ドロップダウンメニューのAPIセクション」を読み込もうとしましたが、成功しませんでした。 onMouseEnter(を使おうと...

P粉877114798 2024-03-29 17:58:41

タイトルが次のように書き換えられました: フレックスボックスメニューとタイトル付きのテーブル - テーブルの幅に基づいてタイトルを切り詰めることは可能ですか?

flexboxCSSを使用してこのようなことを実現したいと考えています。メニューは固定幅ですが、テーブルは自動的に拡大する可能性があり、ヘッダーは長い場合でもテーブルの幅を超えてはなりません。言い換えれば、テーブルは列コンテナーを拡張できる必要がありますが、ヘッダーは拡張できません。 +----+--------+|メニュー|タイトル||+--------+||テーブル|+----+--------+これは 1 つのフレックス列だけで簡単に実現できます。 <html><スタイル>

P粉642920522 2023-09-06 17:30:06

Vue トランジションのトランジション遅延を削除するにはどうすればよいですか?

Vue を使用して、マウスを画像の上に置くとテキストボックスが上に移動してフェードインするようにアニメーション化しています。アニメーションは正しいですが、開始するまでにわずかな遅延があります。画像をホバーするとテキストボックスがスムーズにフェードインし、上に移動し始めるようにしたいと考えています。テキストボックスは適切にフェードアウトし、カーソルが離れると下に移動します。テンプレート:`{{バッジ[アイテム].説明}}`、メソッド:{hoverStart(i){this.hoveredIndex=i;}、

P粉757432491 2023-08-17 17:36:49

Vanilla JS setTimeout(): 間違った動作の特定

ハンバーガーメニューのアニメーションを HTML、CSS、およびバニラ JavaScript で作成しました。期待される結果ハンバーガーメニューボタンをクリックすると、次のイベントが発生します。ハンバーガーメニューアイコンをクリックすると、メインが 180 度回転し、2000 ミリ秒で高さに沿って縮小します。 2000 ミリ秒が経過すると、メニューが表示され、ハンバーガーアイコンが X に変わります。終了ボタンをクリックしてください: ページをさらに 180 度回転しますメニューをオーバーレイしますメニューを非表示にします: display:none; 終了ボタンをハンバー...

P粉797855790 2024-04-02 20:44:40

NextJS プロジェクトで Tailwind と MUI を使用する場合の予期しない動作 (白いボタンのバグ)

現在、NextJS、TailwindCSS、MUIReactUI ライブラリを使用してプロジェクトを構築しています。 MUI ボタンをプロジェクトに追加しようとすると、正常に機能しますが、ボタンの色は白のままです。ホバーすると色は通常に戻りますが、ボタンをクリックすると波紋効果が残ります。ただし、ホバリングしていない場合は白に戻ります。 _app.{js,jsx.ts,tsx} ファイルにインポートしたグローバル CSS ファイルから tailwind ディレクティブを削除すると、ボタンは再び正常に機能しますが、これにより TailwindCSS も削除されます。

P粉996763314 2023-11-04 11:04:23

CSS グリッド: 子コンテンツが列幅をオーバーフローした場合に新しい行を作成する

CSS グリッドに基づいた 2 列のレイアウトがあります。 2列目の内容が1frを超えた場合、新しい行を作成したいと思います。現状では、コンテンツが単に列から溢れてしまいます。このレイアウトの要件の 1 つは、右側のメニュー列の項目が 1 行にあることです。これを次のように実行します。 .right-menu{...grid-auto-flow:columndense;...} Grid-auto-flow 属性を削除すると、オーバーフローが停止します。ただし、アイテムは複数の行に積み重ねられており、これは私が望むものではありません。 .riも変換してみました

P粉212114661 2023-09-05 15:18:28

html5 - vue プロジェクトの vuex ストレージの問題

実装効果: ボタンをクリックして、左側のメニューの幅を切り替えます。 Vuex を使用してフィールド IsOpen を保存し、ナビゲーションコンポーネントとメニューコンポーネントの両方がフィールドの初期値を取得しました。ナビゲーションコンポーネントのボタンをクリックすると、IsOpen の値も切り替わりますが、クラス名は切り替わります。幅を変更するものは切り替わりません。これ...

迷茫 2017-06-27 09:19:31

JavaScript - slideToggle は折りたたみメニュー効果を実装していますが、このオプションをクリックすると展開され、他のオプションが自動的に折りたたまれることをどのように実現すればよいでしょうか?

実現したいのは折りたたみメニューですが、スライドトグルはクリックすることによってのみ折りたたむことができます。他のオプションをクリックすると、展開されたメニューが自動的に折りたたまれます。どうすれば変更できますか?コードは次のとおりです: $("> li", this).each(function () { {code...}

某草草 2017-07-05 11:06:06

CSS スタイルがサイトに適用されない

Bootstrap5を使用してWebサイトを作成していますが、index.cssプロパティがindex.htmlに適用されません。サービスカードの上にマウスを移動すると、背景が変化し、トランジション効果が得られます。ここからここまでになるはずです。ただし、サイトの背景をランダムな色に変更しようとすると、変更がサイトに反映されないため、HTML にリンクされている CSS に問題がある可能性があります。 @importurl('https://fonts.googleapis.com/css2?family=P

P粉613735289 2024-04-06 17:12:23

JavaScript - 以下の 2 つの図の切り替え効果に示すように、QQ のような左スライドメニューナビゲーションを Vue に実装する方法

(www.sf.gg) は、中国を代表する開発者テクノロジーコミュニティです。私たちは、プログラミング愛好家に純粋で高品質な技術交流プラットフォームを提供し、開発者と一緒に学び、コミュニケーションし、成長し、開発者の時代を作りたいと考えています。

滿天的星座 2017-06-29 10:09:57

タイトルは次のように書き直されました： CSS ですべての入力領域 (電子メールのサインアップ、コメントボックス、レシピインデックスページのドロップダウンを含む) のテキストのサイズを変更するにはどうすればよいですか?

ウェブサイト: https://olivesfordinner.com/ ホームページにサインアップするためにメールを入力するときにテキストを大きくする CSS コードを探しています。これは小さすぎます。レシピ投稿 (例: https://olivesfordinner.com/toasted-muesli-recipe/) にコメントを残すとき、読者が入力するにつれてテキストを大きくするにはどうすればよいですか。繰り返しますが、このテキストは小さすぎます。左列のドロップダウンテキストボックスのテキストを大きくする方法。とても小さいんです！ https://ol

P粉465675962 2023-09-14 15:17:43