3

簡単に言えば、画像を左右ではなく上下に動かしたいのです。私はこのjqueryのビットを見つけて、自分自身を助けるためにそれを変更しました。それはクロムとFirefoxで動作しますが、主はIEで私を助けてくれます(いつものように)。

これにしようとしています: http://demo.rickyh.co.uk/css-position-x-and-position-y/ 真ん中のもの。IE 9 ではなく chrome と ffox で動作します

    /*js*/
$(document).scroll(function(){
var $this = $(this);
$(".natface").css('left', 114 - $this.scrollLeft());
});

/*css */
.natface{
position: fixed;
left: 114px;
width: 88px;
height: 93px;
z-index: -2;
}

これにより、ページを上下にスクロールしてこの画像を上下に移動させることができますが、ウィンドウを小さくしてから左から右にスクロールすると、左右にスクロールしない場所になります。悲しいことに、これはIEの場合ではありません.ウィンドウを小さくしても、右にスクロールすると右にスクロールします.

マージン ライン ボックスの左側を少しオーバーラップしてスクロールし、テキスト ボックスに話しかけているように見える画像を使用して、マージン ライン ボックスをイメージできる場合。それが私の意図です。

私もこれらすべてに非常に慣れていないので、どこが間違っているのかを知るのはちょっと難しいです。初めてスタックオーバーフローを使用して申し訳ありません。

4

1 に答える 1

1

編集：あなたは完全に質問を変更しました、そして今私は少し混乱しています。位置固定とIEの問題は、クァークズモードで実行していることが原因である可能性があります。strictIEで機能するには、position：fixedのDoctypeが必要です。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

私の古い答えもここに残します：

CSSプロパティがありますposition:fixedが、このプロパティはIE6とiOS4ではサポートされていないと思います。

位置：固定JSFiddle http://jsfiddle.net/DLeYv/1/

Javascriptを使用したい場合は、次のようにすると、水平方向と垂直方向の両方にスクロールします。

$(".natface")
  .css('top', 114 + $this.scrollTop())
  .css('left', 100 + $this.scrollLeft());

.natfaceこれは、ウィンドウがスクロールされるのと同じピクセル数（scrollTop）にスクロールし、次にさらに114ピクセル下にスクロールし、左にスクロールされるのと同じ量にスクロールするようにクラスに指示します。

これが機能するためには、.natface要素が「絶対」の位置にあり、他の配置された要素の内部にない必要があります（<body>タグのすぐ内側のように）。

JSFiddle http://jsfiddle.net/DUnUm/2/

于 2012-10-12T22:29:18.520 に答える