jquery - CSS3 の動的マスクが正しく機能しない

Question

グラデーション ツールを使用して基本的な単純な動的マスクを作成しようとしましたが、正しく機能しません。私はGoogle Chromeを使用していることに注意してください。

マウスをある場所から別の場所にドラッグすると、円の形状とぼかしが奇妙に変わります。

http://jsfiddle.net/mrdSs/101/

どうすればこれを修正できますか?

Answer 1

http://jsfiddle.net/5J8D6/4/

circle closest-side代わりに tryを使用しないでください50px 50px。明示的な形状とサイズを設定する必要がありました

var t = "background-image: -webkit-radial-gradient("+e.pageX+"px "+e.pageY+"px, 50px 50px,  rgba(0,0,0,0) 50%, rgba(0,0,0,1) 100px)";

http://www.impressivewebs.com/css3-radial-gradient-syntax/を参照してください。