web-dev-qa-db-ja.com

jQueryを使用してゾーンが存在する場合にdivを下に移動する

ゾーンが存在する場合は<div>を下に移動しようとしていますが、適切なクラスなどをターゲットにするのに少し問題があります。

// See http://jsfiddle.net/xgbzm/.
(function ($) {

  if (!$(this).hasClass('responsive-layout-normal')) {
    if ($('.page .section-header .zone-ticker-wrapper', this).length < 0) {
      $('.qtip .qtip-wrapper', this).css('margin-top', '65px');
    }
  }

})(jQuery);

どうすればそれを達成できますか？

7javascriptthemingregions
1
mistrytheory

おそらくあなたの問題はコンテキストだと思います...$(this)は現在のコードでは定義されていません。

最初に行うことは、対象の要素が実際に存在するように、コードがドキュメントで実行できることを確認することです。

_(function ($) {
  $(function() {
    // ...
  });
})(jQuery);
_

次に、$(this)を処理する必要があります。現在のコンテキストでは、そのクラスの_<body>_タグを確認する必要があります。

_if (!$('body').hasClass('responsive-layout-normal')) {
  // ...
}
_

最後に、レスポンシブテーマを使用しているので、おそらくそのコードをレスポンシブにして、Omegaがメディアクエリを変更したときに実行するようにします。 _<body>_タグにバインドしていて、適切なコンテキストがあるので、$(this)は期待する要素を参照することに注意してください。

_(function($) {
  $(function() {
    $('body').bind('responsivelayout', function(e, d) {
      if (!$(this).hasClass('responsive-layout-normal')) {
        // Make changes
      }
      else {
        // Undo changes
      }
    });
  });
})(jQuery);
_
1
Clive

この間ずっと、私は正しい答えを持っていました。これが機能しなかった理由は、「qtip」クラスに「display：none」が設定されていて、ソースコードから効果的に隠されていたからです。表示されていた別のクラスを使用して、問題を解決しました。

私は この方法 を使用してみましたが、実際には役に立ちませんでした。誰かが将来同じような問題に遭遇した場合、このリンクが役立つかもしれないと私は確信していますが。

ご協力ありがとうございます:)

0
mistrytheory