Можно ли вызвать Mouseevents с помощью divcontainer?

Question

У меня есть элемент div с идентификатором mypointer, который имеет абсолютное положение. Я анимацию этого div на странице с jquery. Цель - презентация, в которой элементы показывают одно и то же действие на элементе div, как указатель мыши. Поэтому я хочу симулировать события mouseover, click и rightclick. Возможно ли это? Может ли кто-нибудь дать мне пример, который покажет мне, как это сделать?

Спасибо за ваши ответы

Lara

P.S. Пример link text Красный квадрат над элементом h1. Возможно ли выполнить событие h1 mouseover при столкновении с mypointer и элементом h1?

Answer 1

Я не совсем уверен, если я вас хорошо, но «имитировать» события, как mouseover и так далее, вы всегда можете использовать JQuery-х .trigger() в форме, как:

$('#my_div_id').trigger('mouseover'); 

Вы также можете позвонить более «подробный» версия, где вы можете указать события аргументы

$('#my_div_id').trigger({ 
    type: 'keypress', 
    which: 13, 
    ctrlKey: true 
}); 

который Infact бы моделируют возврата клавиши при ctrl key нажатии на «my_div_id». Если вам нужен только код обработчика событий, используйте его. triggerHandler().

Answer 2

Возможно, я не понимаю вашу идею полностью, но я написал код.

Это работает очень просто. Мы связываем два события «click mouseover» на #mypointer, а также на h1 (или любой другой селектор). Когда событие запускается на #mypointer, мы проверяем каждый элемент h1, чтобы он соответствовал его позиции с позицией #mypointer, и если match - запускать событие по согласованному элементу.

 

"use strict"; 
/*global $*/ 
function getElementCoordinates(el) { 
    return { 
    left: el.offsetLeft, 
    right: el.offsetLeft + el.offsetWidth, 
    top: el.offsetTop, 
    bottom: el.offsetTop + el.offsetHeight 
    }; 
} 
 

 
function checkIntersection($el) { 
    var pointer = getElementCoordinates($('#mypointer')[0]); 
    var element = getElementCoordinates($el[0]); 

    if ((pointer.left >= element.left && pointer.left = element.left && pointer.right = element.bottom && pointer.bottom = element.bottom && pointer.top 



$(function() { 
    $('#mypointer').live('click mouseover', function (e) { 
    //here write selectors you want to check for collision 
    $('h1').each(function() { 
     if (checkIntersection($(this))) { 
     $(this).trigger(e.type); 
     return false; 
     } 
    }); 
    }); 
    $('h1').live('click mouseover', function (e) { 
    $("#output").html(e.type + ' fired on ' + e.target.nodeName); 
    }); 
}); 
 

К сожалению, анализатор "съесть" функция checkIntersection, полный код доступен на http://www.everfall.com/paste/id.php?263utdc1nmqy

WBR, Роман.