0

左側の固定divに入ると、トップリンクへのスクロールがユーザーのマウスに追従するようにしようとしています。私がやろうとしていることのプロトタイプをいじりましたが、私のスキルが低すぎて実際に機能させることができません。助けてください。

  var mouseX = 0, mouseY = 0;
$(".side").mousemove(function(e){
   mouseY = e.pageY-19; 
});

var follower = $("#follower");
yp = 0;
var loop = setInterval(function(){

    yp += (mouseY - yp) / 6;
    follower.css({top:yp});

}, 10);

フィドル: http://jsfiddle.net/grammakov/tDGRc/1

4

1 に答える 1

1

私のウェブサイトには次のようなものがあります。

$("body").on( "mousemove" , "a.refreply",  function(e){ relocatePopup(e); });

マウスがクラス「refreply」の特定のリンクの上にある場合、div#popup が表示され、マウスが移動するとポップアップがカーソルに従います。ポップアップを表示する部分はここでは示していません。基本的には $('#popup').show(); で終わります。

関数 relocatePopup は次のとおりです。

function relocatePopup ( e, useglobal ) {

if ( useglobal == true ) {
    var e = new Object;
    e.pageX = global_x;
    e.pageY = global_y;
}

var popup_height = parseInt( $("div#popup").css("height") ) ;
var bottom_popup = e.pageY + popup_height + 20;
var bottom_page = window.pageYOffset + window.innerHeight;
if ( bottom_popup > bottom_page ) {
    $('div#popup').css("top", bottom_page - popup_height - 5 ).css("left",e.pageX+20);
}else{
    $("div#popup").css("top",e.pageY+20).css("left",e.pageX+20);
}
}

基本的にはマウスイベントのx、yを取得し、残りはポップアップのコンテンツが表示画面の外に表示されるかどうかを計算し、位置を再計算してポップアップをページ内に保持し、「トップ」と絶対に配置する必要がある要素の「左」。

于 2013-03-28T16:16:39.427 に答える