1

現在、rulerguides.jsで作業しています。そして、ルーラーとグリッドラインの特定の div にカスタマイズしました.REFER THIS FIDDLE . ルーラーは私にとっては正常に機能していますが、ボディ要素のみから計算されたドラッグ ゲーブル作成 div ( GRID LINES )、つまりウィンドウの上部とウィンドウの左端を意味します。私のコードでは、ルーラーに特定の div を送信できます。

var evt         = new Event(),
    dragdrop    = new Dragdrop(evt),
    rg          = new RulersGuides(evt, dragdrop,document.getElementById('workarea'));

特定の div から開始する必要があります (例:ルーラー h 選択不可クラスは水平グリッド線を作成し、ルーラー v 選択不可クラスは作業領域に垂直グリッド線を作成します。) ドラッグ可能な開始要素を取得するには? そして、 image のように特定の div を開始する必要があります デモ画像。

2 日以上もがき苦しんでいます。この問題を解決するにはどうすればよいですか?

4

1 に答える 1

4

実は RulersGuides.js はドキュメント本体以外のコンテナで使用することを想定していないので、iframe に配置することを考えます。本当に div に含める必要がある場合は、いくつかの調整が必要です。

  1. getWindowSize、getScrollPos、および getScrollSize 関数を更新して、コンテナーのサイズを計算します。

  2. マウスダウン ハンドラーで vBound と hBound を使用する代わりに、次のように、vLowBound、vHighBound などを導入する必要があります。コンテナーの左と上のオフセットが考慮されます。 

    if (vLowBound === 0) {
    vLowBound = container.offsetLeft;
    vHighBound = vRuler.offsetWidth + vLowBound;
    hLowBound = container.offsetTop;
    hHighBound = hRuler.offsetHeight + hLowBound;
}

適切なチェックで

if (
    (
        (x > vLowBound && x < vHighBound) ||
        (y > hLowBound && y < hHighBound)
    ) && rulerStatus === 1
)

その後

if (y > hLowBound && y < hHighBound) {

と

} else if (x > vLowBound && x < vHighBound) {

によると

  1. 同じ方法で removeInboundGuide を適宜更新します。

それ以外に、DOM 寸法の計算、ダイアログなどにいくつかの変更が必要になると思います。

詳細は以下のjsfiddleを参照してください。

于 2014-12-26T12:19:03.487 に答える