Using the shim

Full source code for this example.

YUI().use('dd-ddm', 'dd-drag', 'dd-proxy', function(Y) {
        //Toggling the buttons
        Y.one('#shim').on('click', function(e) {
            var value = e.target.get('value');
            if (value == 'off' || value == 'Turn Shim On') {
                dd.set('useShim', true);
                e.target.set('value', 'on');
                e.target.set('innerHTML', 'Turn Shim Off');
                Y.one('#debugShim').set('disabled', false);
            } else {
                dd.set('useShim', false);
                e.target.set('value', 'off');
                e.target.set('innerHTML', 'Turn Shim On');
                Y.one('#debugShim').set('disabled', true);
            }
        });
        
        Y.one('#debugShim').on('click', function(e) {
            var value = e.target.get('value');
            if (value == 'off' || value == 'Turn Debugging On') {
                Y.DD.DDM._debugShim = true;
                e.target.set('value', 'on');
                e.target.set('innerHTML', 'Turn Debugging Off');
            } else {
                Y.DD.DDM._debugShim = false;
                e.target.set('value', 'off');
                e.target.set('innerHTML', 'Turn Debugging On');
            }
        });
        
        var dd = new Y.DD.Drag({
            //Selector of the node to make draggable
            node: '#demo',
            useShim: false
        }).plug(Y.Plugin.DDProxy, {
            offsetNode: false,
            resizeFrame: false
        });
        dd.on('drag:start', function() {
            this.get('dragNode').setStyles({
                height: '20px',
                width: '100px',
                backgroundColor: 'blue',
                color: '#fff'
            });
            this.get('dragNode').set('innerHTML', 'Custom Proxy');
            this.deltaXY = [this.deltaXY[0] - 20, this.deltaXY[1] - 20];
        });
});