ホバー時にコンテンツを表示します (カードの高さには影響しません)

ホバー時に表示されるコンテンツを含むブロックがあります。効果の動作方法は次のとおりです。 .hoverCard は、デフォルトで基礎となるコンテンツを表示します (.hoverCard__showOnHover のコンテンツは非表示になります)。 ユーザーが .hoverCard の上にマウスを移動すると、.hoverCard__showOnHover がそのコンテンツを表示し、.hoverCard__body が上に遷移します (「開いた状態」になります)。効果) 上記の視覚効果はデモで確認できますが、アニメーションを完全に動作させることはできません。会いました

P粉289775043 2024-03-27 20:29:28 0  1  440

JavaScript - アニメーションの表示と非表示を切り替えるための良い解決策はありますか?

例: このアニメーションと同じ効果になります 最初に div が非表示になりますが、ボタンをクリックすると表示されてアニメーション効果がかかります 非表示にしても同様ですしかし、明らかに複雑に書きすぎました。もっと簡単な解決策 (サードパーティのライブラリを使用しない) はありますか?

阿神 2017-06-30 09:59:55 0  5  1048

JavaScript - フォトアルバム効果を実現するにはどうすればよいですか?どのプラグインを使用すればよいですか?

クリックして画像をプレビューし、左右にスライドして数字を表示します。リンクをコンピューターに貼り付けましたが、マウスをクリックしても効果がありません。使用できる成熟したプラグインはありますか?書いたマスクはプレビューできますが、左右を切り替えるのは書きにくいです。

PHP中文网 2017-06-30 09:56:05 0  4  785

画像の開始点と終了点

画像の開始点と終了点を設定しようとしています。それで、キャンバスと画像があり、画像をキャンバスに配置すると、開始点/終了点の上にマウスを置いたときに小さな赤い円が点灯するようにしたいのですが、これは他の画像を接続して作成できることを意味します。例: 1) 画像をドラッグします。 2) 画像をキャンバスに配置します。 3) マウスを開始点/終了点に移動すると、小さな赤い点が点灯します。ご覧のとおり、赤い点はホバー時にのみ表示されます。もう 1 つの質問ですが、最初の質問を解決できれば、画像がグリル (正方形) に従っていません。これは html/js のコンストレジスタの例です。

P粉511757848 2023-08-31 12:24:51 0  1  574

折りたたみ可能な要素を Flexbox レイアウトに挿入する方法

画像が折り返されたフレックスボックス レイアウトがあり、画像がクリックされたときに情報を表示したいと考えています。情報は、「列」を移動せずに、画像を含む行とそのすぐ下の行の間に表示される必要があります。これは私が望むタイプの効果です: http://olmenta.altervista.org (本をクリックしたとき)。私がやったことは次のとおりです: https://jsfiddle.net/fabhpnw9/3/varcoll=document.getElementsByClassName("re

P粉366946380 2024-03-19 23:20:59 0  2  375

クリックしたときにテキストが新しい要素 (区切り線など) に変わるようにするにはどうすればよいですか?

ページ上の特定のテキストをクリックすると区切り文字/新しい要素に変わる方法を見つけようとしています。どう説明したらいいのかわかりませんが、画像の下にタイトルがあると想像してください。タイトルをクリックすると、上の画像がテキスト ボックス/別の画像/スクロール可能なセパレーターのようになります。ここでは、右側の頭蓋骨の絵文字をクリックすると、左側のボックスに新しい div/画像が表示されるというページの効果を実現しようとしています。ソースコードを見て、この効果を実現するために彼女が何をしているのかを確認していますが、まだわかりません。 w3schoolsonを使用しようとしています

P粉872101673 2024-04-04 11:21:03 0  1  3793

JavaScript マップ マーカー プラグインを探しています

1. 以下のような効果を実現できるJavaScriptプラグインはありますか? 左側の3つのオブジェクトを右側の地図にドラッグできます 地図上にドラッグしてマウスを放すとマークが残りますマップ上で (マップの位置をマークするために使用されます)、マウスを放した後、編集可能なダイアログ ボックスがポップアップ表示されます。

怪我咯 2017-05-18 10:49:58 0  1  612

ReactJS を使用して要素を非表示にする方法

画面上に文字を表示し、ボタンを押したときだけ非表示にしたいのですが、方法がわかりません。この効果を実現するために useState を使用したい: const[textVisibility,setTextVisibility]=useState(true)<buttononClick={()=>setTextVisibility(false)}/>私が見つけた問題は、ボタンをクリックするとページが再レンダリングすると、可視性の値がデフォルトになります。

P粉136356287 2023-09-07 19:21:22 0  2  496

PHP の配列: 新しい項目を追加したときの驚くべき結果

そこで、Instaloaderpython ライブラリによって収集された画像を収集し、Web サイト上のギャラリーに配置できるコードを作成しています。これらを問題なく収集して表示することができましたが、各投稿のヘッダーを実装し始めたところ、問題が発生しました。ライブラリが写真をダウンロードする方法は、コレクション内に複数の写真がある場合、コレクション内の画像の場所に基づいて投稿に _1、_2 などのサフィックスを追加し、.txt ファイルをタイトル。コレクションのフォルダー内容の例: 2022-12-26_14-14-01_UTC

P粉893457026 2024-03-31 14:10:42 0  1  532

HTML テーブル内の画像を右揃えにする方法

Django Web サイトを作成し、結果を上部に小さなフォームのように表示したいと考えています。左側にテーブルがあり、右側のテーブルに 2 つの写真と別の列を追加したいと考えています。よりわかりやすく説明するために図を設計しました - ここに画像の説明を入力します これで、フォーム 1 と表のコードを書きました。バックエンドのコードも書きます。画像とフォーム2はフォームの右側にあるのでhtmlコードの書き方を知りたいです。任意の HTML コードを記述するだけで、表の下に表示されます。誰かが表の右側に写真とフォーム 2 を追加するのを手伝ってくれませんか?今私は

P粉555696738 2023-09-02 09:04:11 0  1  630

Python - フラスコリダイレクトのリダイレクトの問題?

コードは次のとおりです。画像はアップロードできましたが、アップロード成功後に画像が表示されなくなりました。リダイレクトの書き方はこれで良いでしょうか? {コード...} {コード...} --- -------更新------ ------インデックス ルーティングを変更し、目的の効果を達成しました: {code...} しかし、前のアイデアは間違っていたのでしょうか?

phpcn_u1582 2017-05-18 10:48:50 0  1  828

JavaScript - ハイチャート データのレンダリングについて

画像の説明 上のグラフはデータを動的に追加します。コード内の変数 xdata は時間で、形式は 17:21:11 です。これは印刷でき、Y 軸も通常どおり印刷できます。しかし、現在、Y 軸のデータは正常にレンダリングできますが、X 軸が表示できません。期待される効果は時刻を表示することであるはずですが、今は...

習慣沉默 2017-06-26 10:53:06 0  1  865

css3 - CSS フォント スタイルに背景色の代わりに塗りつぶし色を加えたもの

次のようなフォント スタイルがあります。 ハートを包むスパン全体ではなく、ハートに色を追加したい場合、カラー エラーは次のようになります。 スパンの定義は次のとおりです。 {code...}背景色を追加すると、上の画像が表示されます。効果としては、直接色を使用すると、ハート型の境界線にのみ色が付きます。

天蓬老师 2017-06-08 11:02:27 0  2  1267

CSSで画像のパスを変更しても機能しない

CSS の画像パスは静的 Web サイトで変更され、サーバーにアップロードされます。Web サイトを開くと、変更されていない元の効果が表示されます。画像は個別に開くことができます。変更された画像には絶対パスがあります。これはどうすればよいですか?対応しましたか?ありがとう!

PHP中文网用户-5675994 2023-07-20 22:29:02 0  0  1663

ホバー時のチルト効果のバグ

中にテキストが入った傾き効果のあるボタンがあり、ボタンにマウスを置くとボタンの横に 2 つの線が表示されます。ボタンが表示されるまでボタンの上にカーソルを置くコードがありますが、これは非常にランダムな副作用です。これは Chrome の問題だと思いますが、よくわかりません。問題の画像は次のとおりです: https://prnt.sc/hafHhDOHntco.button-skew{position:relative;width:fit-content;padding:6px40px;borde

P粉520545753 2024-03-29 13:34:50 0  1  357

JavaScript - スワイパー画像をスワイプできません

質問の件名は、要求されたデータがなかったため Vue で書かれていたため、偽のデータが作成されました: これは動的に生成された img タグであり、ページ上で使用されます: しかし、Chrome を開いて効果を見ると、これはスワイプできず、最初の画像しか表示されないということですが、その写真の動的生成された画像も以下のように正しい構造になっているのですが、なぜ描画できないのでしょうか...

黄舟 2017-07-05 10:48:46 0  6  1273

次の js; 一部のモバイル デバイスではコンポーネント内のテキストがぼやけます

タイトルの通り、nextjs ページの一部のテキストがぼやけて見えますが、一部のモバイル デバイスではオンラインで表示されるという問題がまだ発生しています。私はこれを最も顕著に感じたのは一部の iPhone です。コンソールを使用してモバイル レイアウトをテストする場合、これはモバイル デバイスにも当てはまります。これは、私のページ上の 2 つのコンポーネントに関する問題です。どちらのカードも裏返すと裏面が表示されます。また、Framermotion を使用してアニメーション化されます。スタイル設定は Tailwind で行われ、ページの他の部分の通常のテキストは通常​​どおり表示されます。理...

P粉329425839 2023-09-12 21:31:00 0  1  651

javascript - これがローカルでは機能するのにサーバーでは機能しないのはなぜですか?

ローカルで HTML ファイルを作成し、次の 2 つのコードを挿入したところ、正常に実行されましたが、サーバー上では動作しないのはなぜですか?その理由は何ですか?通常、画像をローカルで拡大および縮小してサーバー上で実行できますが、クリックしても効果がありません。 {コード...} {コード...}

ringa_lee 2017-05-19 10:47:15 0  2  919

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

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

P粉546257913 2024-04-04 11:55:21 0  2  455

React アプリケーションのパフォーマンスの最適化: 多数のプロジェクトをレンダリングする効率的な方法

React アプリケーションを開発していて、項目の大きなリスト (数千行) を表示する必要があります。現在、ユーザーがリストをスクロールしたり項目をフィルターしたりすると、パフォーマンスが非常に遅くなります。 React アプリケーションのパフォーマンスを最適化してユーザー エクスペリエンスを向上させる方法はありますか?いくつかの追加情報: - 項目のリストをレンダリングするために React 関数コンポーネントとフックを使用しています。 - リスト内の各項目には、テキストや画像などの複数のデータ フィールドが含まれます。 -現在、組み込みのマップ関数を使用してアイテムのリストを表示しています...

P粉733166744 2024-01-16 20:43:20 0  1  431