0

サンプルコードがあります：

<div style="background: url('test.jpg') no-repeat left center; width: 500px; height: 334px;">
   <div id="button-wrapper" style="position: absolute; opacity: 1; z-index: 100;">
   <input type="button" value="submit">    
   </div>
</div>​

そしてJquery

jQuery(document).ready(function(){
    jQuery("div[id^=\'button-wrapper\']").parent().mousemove(function(e){
        jQuery("div[id^=\'button-wrapper\']").css({
            top:e.pageY-5,
            left:e.pageX-5
         });
    });
});​

マウスをフレームの外に移動するとエラーが発生します（div id = "button-wrapper"）フレームの外で実行されます。修正方法、フレーム内でのみ実行しますか？（デモはこちら）

4

3 に答える 3

1

このリンクを確認してください..コードが更新されました...

このリンクをチェック

そのマウスの動きに制約を追加しました

 var a = $(this).height()-15;
         var b = $(this).width()-35;
        if(e.pageY < a&& e. pageX < b)
        {
        $('div[id^="button-wrapper"]').css({
                        top:e.pageY-5,
            left:e.pageX-5
         });
    }
于 2012-11-22T10:29:14.593 に答える
0

マウスが親 div の外に移動しているかどうかを確認する必要があります。http://jsfiddle.net/qCbwr/40/の例を参照してください。

var _c = $(this);
var _p = _c.position();;

if (_top > (_p.top + _c.height())) _top = _p.top + _c.height();
if (_left > (_p.left + _c.width())) _left = _p.left +_c.width();

コントロールを完全に div の外に出たくない場合は、ボタンのサイズを考慮する必要があります。

于 2012-11-22T10:37:32.197 に答える