public
Created

"Simple" break for PIE with AngularJS

  • Download Gist
149Test.html
HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
<html class="no-js" lang="en" xmlns:ng="http://angularjs.org" ng:app>
<HEAD>
</HEAD>
<BODY>
 
<ng:include src="'samplePIEtemplate.html'" />
<script type='text/javascript' src="http://cdnjs.cloudflare.com/ajax/libs/css3pie/1.0beta5/PIE.js"></script>
<script type='text/javascript' src="http://docs-next.angularjs.org/angular-0.10.6.min.js"></script>
<script type='text/javascript'>
angular.directive('pie', function () {
return function (elm) {
if (window.PIE) {
PIE.attach(elm[0]);
}
};
});
</script>
</BODY>
samplePIEtemplate.html
HTML
1 2 3 4 5
<div id="pieFace" style="
-pie-background: linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(125, 134, 136, 0.3) 10%, rgba(125, 134, 136, 0.3) 60%, rgba(125, 134, 136, 0.6) 80%, rgba(125, 134, 136, 0.8) 100%);
height: 50px;
width: 50px;
" pie=""></div>

I think this "break" is actually due to you trying to apply PIE to a non-element... The 'this' keyword in PIE.attach(this) appears to be pointing to something other than the target div.

See https://gist.github.com/2202558 -- this works without error.

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.