Анатолий

В этом букмарклете канвас лежит поверх всех остальных элементов и занимает всю площадь страницы. Когда летит конфета, чтобы определить, какой DOM-элемент под ней находится, можно воспользоваться методом document.elementFromPoint(x, y) (https://developer.mozilla.org/en-US/docs/Web/API/document.elementFromPoint?redirectlocale=en-US&redirectslug=DOM%2Fdocument.elementFromPoint). А дальше уже разбить его с каким-нибудь эффектом — дело техники.

Отвечая на вопрос — canvas и остальной DOM никак не пересекаются — canvas, просто один из узлов дом-дерева, и изнутри canvas до элементов DOM никак не достучаться, но иногда это можно изящно обойти, как, например в этом случае.

    function gamePolling(){
        $.ajax({
            url: "/game/<%=game.id%>/update",
            dataType: 'json',
            cache: false,
            success: function(data){
                if (data.update == true){
                    window.location.reload();
                }
                else{
                    gamePolling();
                }
            },
            error: function(data, type){
                gamePolling();
            }
        });
    }

$(window).resize();