4

Facebookはどのようにしてプロフィール写真の「移動」をインプレースしますか?

私が話していることを確認するには、http://www.facebook.com/editprofile.php ? sk=picture --> サムネイルの編集 --> サムネイル画像を移動できることに注意してください。

彼らはそれを「ProfilePicSquareEditor」と呼んでいます（ソースコードは入手が困難です）

4

2 に答える 2

4

これは Facebook が使用するものとまったく同じではありませんが、うまく機能しますhttp://odyniec.net/projects/imgareaselect/

現在、いくつかのプロジェクトで使用しています。

于 2011-05-23T15:17:25.727 に答える
0

明らかに、クロップ ウィンドウのドラッグ サイズ変更を制御する JavaScript がたくさんあります。これは、特定のアスペクト比 (または範囲) を強制している場合、少し複雑 (または少なくとも面倒) になる可能性がありますが、HTML に関する限りです。 、それは単に黒い背景のdivであり、その上に完全な画像がありopacity: .5（これにより暗い背景画像が作成されます）、同じ画像の別のコピーがposition: absolutediv（最初のdivの外側にあります）にあるため、整列します最初の画像で正しく。サイズ変更ハンドルのドラッグ イベントに応答するハンドラーは、絶対位置に配置された div (「クロップ ウィンドウ」) の 、top、leftおよびwidthプロパティを継続的に更新します。heighttopleftその中の「前景」画像のプロパティを（ネガに）変更して、背景画像との位置合わせを維持します。

JavaScript は各コーナーの位置も追跡するため、ユーザーが変更を受け入れると、それらのポイントをピクセル座標に変換し (スケーリングを考慮して)、バックエンドにある画像処理ライブラリに渡すことができます。

于 2011-05-23T16:03:18.670 に答える