私は会社のWebサイトを再設計しており、jQueryやFlashなどでかなりの効果があります。これまでのところ、これを行うのにそれほど問題はありませんが、2つの小さな問題が発生し続けています。ここで人々に尋ねた後、成功しただけだったので、ここに行きます:
問題の開発ページ:(URLが削除されました)
創刊
[結果]の下の上部ナビゲーションにある緑色の矢印をクリックします。これは、メニューを右から左にスライドさせることになっています。Firefoxの場合と同じように動作しますが、IEとSafariは、ページの中央でスライド左アニメーションを開始してから、メニューを元の場所に戻します。メニュー自体はCSSに完全に配置されているので、なぜこれを行うのかわかりません。もう1つの問題は、メニューを開いて閉じようとすると(同じ色の矢印を使用して)、Firefoxの場合と同じように遷移しますが、遷移が完了すると再び表示されます。IEとSafariでは、メニューは完全に消えますが、アニメーションはページの中央から再開されます。
2番目の(sorta)問題
このスライドがうまくいくのであれば、下の灰色の矢印ボックスをクリックすると上下にスライドする下部の「バケット」にも同様の効果を適用したいと思います。現在、jQueryの.animate関数をハッキングして、最初に高さを増やし、次に次のように負のマージンを適用しています。
$('#footer-bucket1')
.animate({ height: '392px' }, 300)
.animate({ marginTop: '-306px'}, 300)
.addClass('bucket-open');
スライドアップトランジションを適用すると、ボックスが大きくなっていることがわかりましたが、下方向にページから外れています(オーバーフローがあります:非表示が適用されています)。現在のように、ボックスを文字通り上にスライドさせてコンテンツを表示するように指定する方法はありますか?前もって感謝します!