0

カーソルをホバーに設定するマウスオーバーイベントを使用して、Raphaelで描画されたパス(線)について考えてみます。細いパス/ラインの場合、そのパスの上にマウスを置くことは困難です。

パスにカーソルを合わせやすくするために、パスに非表示の境界線/パディング/境界線を追加する方法はありますか?

4

1 に答える 1

3

それを達成するための本当に簡単な方法は次のとおりです。

  1. ホバー トリガーとして使用しているパスを で複製しますelementclone
  2. でクローンを現在のパスの前に移動しelementます。insertAfter
  3. を使用しelementます。attrクローンの不透明度を 0 のすぐ上に設定して、効果的に非表示にしながらもクリック イベントを受け取り、元のパスのストローク幅 + 必要な余白に等しいストローク幅プロパティを設定します。
  4. 複製された要素にホバー イベントを追加します。

これにより、元の細いパスの代わりにマウス イベントを受け取ることができる、元のパスよりもはるかに太い非表示のパスが得られます。

マウスが代理パス上にあるときに十字線が表示されるように、カーソル プロパティを設定して、ここでこれをモックしました。

于 2012-09-06T19:53:06.510 に答える