jQueryのslideUp（）が終了した後、コンテンツの残りの部分は、所定の位置にジャンプします

StackOverflow https://stackoverflow.com/questions/1116468

  •  12-09-2019
  •  | 
  •  

質問

私は情報メッセージの簡単なjQueryのslideUpをやろうとしています。問題は、メッセージがきれいに出てきやアニメーションは偉大に見えるが、アニメーションが完了するまで、私は出てスライディングよ1以下のdivを入れたままということ、それからだけの場所に飛び込んであります。私は私のメッセージが消えるよう、以下のdivを上にスライドします。

私は私ができるCSSのほぼすべての側面を変更しようとした（例えば、取り外し位置：相対など、コンテナをunfloated）が、何も動いていないようにみえます。

。

ここではJavascriptがいます：

$(function() {
    setTimeout(function(){
        $('.flash').slideUp('slow');
      }, 1000);
});

ここではHTMLです。

<div class='page-content'>
  <div class='flash'>
    <div class='notice'>I'm testing the flash</div>
  </div>
  <div class='data-table'>
    ... The rest of the page ...
  </div>
</div>

ここでは、関連するCSSです。

.page-content {
  width: 95%;
  float: left;
  padding: 25px 2.5% 0;
}
.flash {
  background-color: #dcffb9;
  border: 1px solid #78b73f;
  border-bottom: 1px solid #d9d9d9;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 15px;
  padding: 0;
  position: relative;
}
.flash .notice {
  background: url(../images/flash-notice-bg.gif) no-repeat 20px 50%;
  border-bottom: 1px solid #78b73f;
  padding: 20px 0 20px 70px;
}

任意の助けいただければ幸いです。

役に立ちましたか？

解決 2

フォローアップ、問題は、私はjavascriptのファイルRailsのサポートのためのjQueryを含む場合です。それがなければ、それが正常にスライドします。

JRailsは、何らかの理由でslideUpとslideDownを再定義します。この正確な問題に対処するJRailsに対して提出バグがあります：ます。http：// code.google.com/p/ennerchi/issues/detail?id=43する。バグの提出者が提案し、スライド機能のJRailsバージョンを名前を変更し、私のものは、正しく動作するように私はやっています。

他のヒント

問題はマージン下で：15ピクセル; .flash要素に。あなたが0にあなたのマージンとパディングを設定していることを確認します。

slideUpが0に高さを低くすることで動作するためですが、それは余白を変更しません。要素がアップし、スライドを終了したときに、それはまだ15ピクセルのマージンを持っています。最後のステップは、マージンがあまりにも消えた時点で、要素を隠すことである、とあなたはジャンプを参照してください。

あなたは.flash .noticeに余裕を保つことができる。

このはjrailsで既知のバグです... jrailsとPRESTOからslideUp / slideDown機能を削除します！うまくいけば、これはjrailsの次のリリースで修正されます。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top