1

実際の画像をつかんでドラッグすることで、「小さな手」カーソルで div 内の JPG を手動でスクロールすることは可能ですか?

たとえば、長い水平ビットマップがあり、それを小さなウィンドウに表示したい場合に、ズームインするとフォト エディタのようにスクロールします。

4

2 に答える 2

2

これを行うには、JavaScript マジックが必要です。これをチェックしてください：http://jsfiddle.net/bCuGM/。

<style type="text/css">
  #container {
    width: 400px;
    height: 400px;
    overflow: hidden;
    cursor: pointer;
  }
  #draggable {
    width: 1024px;
    height: 819px;
  }
</style>

<div id="container">
  <div id="draggable">
    <img src="http://farm3.staticflickr.com/2593/3884464511_a77144821e_b.jpg">
  </div>
</div>

<script>
  $("#draggable").draggable();
</script>
于 2013-01-07T13:27:07.350 に答える
1

JavaScript と少しの CSS を使用してそれを行うことができます。

イメージに次の CSS ルールを追加します。

cursor: pointer;

JavaScript を使用して、画像に mousedown、mousemove、および mouseup イベントを追加します。次に、JavaScriptを使用して親divのスクロールを変更します

于 2013-01-07T13:13:46.667 に答える