クラスを追加してjQueryでCSSトライアングルを非表示にしようとすると、機能しないのはなぜですか?

ダグ・スミス

を使用してdivにアタッチされているCSS三角形を非表示にしたいのですが、:before実装するこのソリューションに出くわしました:https//stackoverflow.com/a/11354393/998117

ただし、jQueryが機能していません。

$(".contact input[type='submit']").click(function(event) {
    event.preventDefault();
    $(".contact .inner").addClass("hidden");
    ...

(はい、呼び出されます。)

これは私のCSS / SASSがどのように見えるかです:

.contact {
    background: #3c6ea5;
    color: #fff;
    display: none;
    height: 500px;

    .hidden:before {
            display: none;
        }

    .inner {
        margin: auto;
        padding-top: 20px;
        position: relative;
        width: 400px;

        &:before {
            border: solid;
            border-color: #3c6ea5 transparent;
            border-width: 14px 16px 0 16px;
            bottom: -107px;
            content: "";
            display: block;
            position: absolute;
            right: -50px;
        }

        .hidden:before {
            display: none;
        }
    }
    ...

なぜそれを隠さないのですか?私は何が間違っているのですか?

追跡

あなたのSassは少しオフになっているはずです:

.inner {

    &.hidden:before {
        display: none;
    }
}

非表示になる前の&に注意してください

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

モジュールではなくクラスをインポートするときにpythonのmonkeypatchが機能しないのはなぜですか?

分類Dev

動的なWebページをWebスクレイピングしようとしても、エラーコードは表示されませんでした。「機能している」ことを確認するにはどうすればよいですか?

分類Dev

親クラスを渡して子入力を追加するときにjQueryのappendメソッドが機能しないのはなぜですか?

分類Dev

バックグラウンドスクリプトコンソールを監視しているときにのみGoogle拡張機能が実行を開始するように見えるのはなぜですか

分類Dev

トグルアイコンをクリックした後、純粋な引き出しのラベルとアイコンを非表示にするにはどうすればよいですか?

分類Dev

Retrofitを使用してRESTWebサービスを利用するためのシンプルなAndroidクライアント-「サーバーへの接続に失敗しました」というエラーが表示されるのはなぜですか

分類Dev

DOMに挿入した後でdivのスタイルを変更すると、トランジションが機能しないのはなぜですか?

分類Dev

このタイムアウト機能を追加しました。divが実際に削除されているのか、それとも非表示になっているのかを確認するにはどうすればよいですか?

分類Dev

VMware vSphereクライアントをインストールしようとするとWineがクラッシュするのはなぜですか?

分類Dev

ジェネリックメソッドを非ジェネリックメソッドでオーバーライドするときに、サブシグネチャとチェックされていないルールが戻り値の型に対してこのように機能するのはなぜですか?

分類Dev

cでキュークラスを作成しようとしています#デキュー機能が機能しないのはなぜですか?

分類Dev

プラグインの破棄機能が機能していないときに再インスタンス化できるように、jQueryプラグインインスタンスを破棄しますか?

分類Dev

ルーティングを追加すると、AngularJSアプリが機能しないのはなぜですか?

分類Dev

インポートライブラリはどのように機能し、MinGWがそれらを必要としないのはなぜですか?

分類Dev

ブラケット '{'をreactでインポートしようとすると、予期しないトークンになるのはなぜですか?

分類Dev

jqueryを使用して特定のcssクラスなしでアンカータグを取得するにはどうすればよいですか?

分類Dev

mllibの例をコンパイルしようとしているときにsbtがエラーをスローするのはなぜですか

分類Dev

NetSuiteクライアントスクリプトにボタンを追加して、スクリプト機能のトリガーとして使用するにはどうすればよいですか?

分類Dev

JUnitテストを実行しようとすると、「ClassLoaderで永続性アーカイブを検索しているときに例外がスローされました」というエラーが表示されるのはなぜですか?

分類Dev

パスワードなしでOpenSSHDサーバーのクライアントとして `lsh`を使用するにはどうすればよいですか?

分類Dev

ASP.NET MVCバンドルを使用しているときに、クライアントがサーバーにアクセスしてファイルが変更されているかどうかを確認するのはなぜですか?

分類Dev

エラーメッセージをフラッシュしようとしているときに、遅延が機能しないのはなぜですか?

分類Dev

SQLiteテーブルにUNIQUEINDEXを追加しようとすると、「インデックス付きの列が一意ではありません」というエラーが表示されるのはなぜですか?

分類Dev

div onclickでクラスを追加および削除しても機能しないのはなぜですか?

分類Dev

スクリプトタグとスタイルタグにナンスを追加して、「安全でないインライン」CSPヘッダーフィールドを回避するにはどうすればよいですか?

分類Dev

デスクトップおよびモバイルのポートレートとランドスケープで機能するレスポンシブな方法でグラフを表示するにはどうすればよいですか?

分類Dev

新しいUITableviewControllerサブクラスを提示するときに、以前に機能していたXcodeプロジェクトがXcode 7でハングアップするのはなぜですか?

分類Dev

プラスとマイナスのアイコンでdivを表示するにはどうすればよいですか?マージンが残っているdivが機能していませんか?divテキストを非表示/表示する方法は?

分類Dev

表示を[なし]から[ブロック]に変更すると、Googleグラフの幅が機能しないのはなぜですか。

Related 関連記事

  1. 1

    モジュールではなくクラスをインポートするときにpythonのmonkeypatchが機能しないのはなぜですか?

  2. 2

    動的なWebページをWebスクレイピングしようとしても、エラーコードは表示されませんでした。「機能している」ことを確認するにはどうすればよいですか?

  3. 3

    親クラスを渡して子入力を追加するときにjQueryのappendメソッドが機能しないのはなぜですか?

  4. 4

    バックグラウンドスクリプトコンソールを監視しているときにのみGoogle拡張機能が実行を開始するように見えるのはなぜですか

  5. 5

    トグルアイコンをクリックした後、純粋な引き出しのラベルとアイコンを非表示にするにはどうすればよいですか?

  6. 6

    Retrofitを使用してRESTWebサービスを利用するためのシンプルなAndroidクライアント-「サーバーへの接続に失敗しました」というエラーが表示されるのはなぜですか

  7. 7

    DOMに挿入した後でdivのスタイルを変更すると、トランジションが機能しないのはなぜですか?

  8. 8

    このタイムアウト機能を追加しました。divが実際に削除されているのか、それとも非表示になっているのかを確認するにはどうすればよいですか?

  9. 9

    VMware vSphereクライアントをインストールしようとするとWineがクラッシュするのはなぜですか?

  10. 10

    ジェネリックメソッドを非ジェネリックメソッドでオーバーライドするときに、サブシグネチャとチェックされていないルールが戻り値の型に対してこのように機能するのはなぜですか?

  11. 11

    cでキュークラスを作成しようとしています#デキュー機能が機能しないのはなぜですか?

  12. 12

    プラグインの破棄機能が機能していないときに再インスタンス化できるように、jQueryプラグインインスタンスを破棄しますか?

  13. 13

    ルーティングを追加すると、AngularJSアプリが機能しないのはなぜですか?

  14. 14

    インポートライブラリはどのように機能し、MinGWがそれらを必要としないのはなぜですか?

  15. 15

    ブラケット '{'をreactでインポートしようとすると、予期しないトークンになるのはなぜですか?

  16. 16

    jqueryを使用して特定のcssクラスなしでアンカータグを取得するにはどうすればよいですか?

  17. 17

    mllibの例をコンパイルしようとしているときにsbtがエラーをスローするのはなぜですか

  18. 18

    NetSuiteクライアントスクリプトにボタンを追加して、スクリプト機能のトリガーとして使用するにはどうすればよいですか?

  19. 19

    JUnitテストを実行しようとすると、「ClassLoaderで永続性アーカイブを検索しているときに例外がスローされました」というエラーが表示されるのはなぜですか?

  20. 20

    パスワードなしでOpenSSHDサーバーのクライアントとして `lsh`を使用するにはどうすればよいですか?

  21. 21

    ASP.NET MVCバンドルを使用しているときに、クライアントがサーバーにアクセスしてファイルが変更されているかどうかを確認するのはなぜですか?

  22. 22

    エラーメッセージをフラッシュしようとしているときに、遅延が機能しないのはなぜですか?

  23. 23

    SQLiteテーブルにUNIQUEINDEXを追加しようとすると、「インデックス付きの列が一意ではありません」というエラーが表示されるのはなぜですか?

  24. 24

    div onclickでクラスを追加および削除しても機能しないのはなぜですか?

  25. 25

    スクリプトタグとスタイルタグにナンスを追加して、「安全でないインライン」CSPヘッダーフィールドを回避するにはどうすればよいですか?

  26. 26

    デスクトップおよびモバイルのポートレートとランドスケープで機能するレスポンシブな方法でグラフを表示するにはどうすればよいですか?

  27. 27

    新しいUITableviewControllerサブクラスを提示するときに、以前に機能していたXcodeプロジェクトがXcode 7でハングアップするのはなぜですか?

  28. 28

    プラスとマイナスのアイコンでdivを表示するにはどうすればよいですか?マージンが残っているdivが機能していませんか?divテキストを非表示/表示する方法は?

  29. 29

    表示を[なし]から[ブロック]に変更すると、Googleグラフの幅が機能しないのはなぜですか。

ホットタグ

アーカイブ