javascript/jquery で CSS スプライトを制御したいと考えています。ユーザー入力に基づいて、画像の位置を移動する必要があります。
ケース: 400x400 のイメージ コンテナーがありますが、表示したいイメージは 400x1200 であるため、その時点で高さは 400 しか表示できませんが、幅は一定です。
ユーザーがボタンをクリックしたときに画像の一部を表示したいと思います。私が欲しいものを示すために例を描きました: http://0o2471.net/55070
そのモックアップには、黒いフレームでマークされた 400x400 のイメージ コンテナーがあります。緑色の背景は、ユーザー入力に基づいて表示したい「イメージ」です。したがって、ユーザーが「ボタンの下部」を押すと、下部の位置が中央 (画像コンテナー) に変更されるとします。
これを行う方法について何か提案はありますか? jquery/javascript のどの関数を使用すればよいですか? CSSスプライトは最良の方法ですか? コード全体は必要ありません。いくつかの指示だけです。