The shadowOffsetX property

The shadowOffsetX property is used to set the horizontal offset of the shadow

[No canvas support]
An example of the shadowOffsetX property

This sets the X offset of the shadow. Values can be positive (the shadows are cast to the right) or negative (the shadows are cast to the left). Inner shadows are not supported but are achievable by:

An example

    window.onload = function ()
        var canvas  = document.getElementById("cvs");
        var context = canvas.getContext('2d');

        var x       = 50;
        var y       = 50;
        var width   = 100;
        var height  = 100;
        context.shadowColor = '#ccc';
        context.shadowOffsetX = 30;
        context.shadowOffsetY = 0;
        context.shadowBlur = 15;
        context.fillStyle = 'red';    
        context.fillRect(x, y, width, height);