Open IngwiePhoenix opened 9 years ago
Going off the rough explanation from the readme, I tried my luck and tried to create a small demo. It turned into this:
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="jquery-1.11.1.js"></script> <script type="text/javascript" src="blur.js"></script> <style> body { background-image: url("http://localhost:8080/cdn/theme/images/bg.jpg"); background-repeat: no-repeat; background-position: center center; background-attachment: fixed; height: 100%; width: 100%; color: white; } .block { height: 250px; position: absolute; top: 200px; left: 100px; right: 100px; background: rgba(0,0,0,0.6); } </style> </head> <body> <div id="app"> <div class="block">ovo</div> </div> <script> jQuery(function($){ $(".block").blurjs({ //source: 'body', radius: 5, overlay: 'rgba(255,255,255,0.4)' }); }); </script> </body> </html>
Upon launching, I got the "cannot access image" error. On further reading, it was due to the netscape object not being defined.
What am I doing wrong here - or, what exactly can I do to fix it?
This is a cross domain scripting error I think. Same one I've had with the original canvas script that Blurjs is based on. See here for details: https://github.com/Quasimondo/QuasimondoJS/issues/7
Going off the rough explanation from the readme, I tried my luck and tried to create a small demo. It turned into this:
Upon launching, I got the "cannot access image" error. On further reading, it was due to the netscape object not being defined.
What am I doing wrong here - or, what exactly can I do to fix it?