danielrapp / noisy Goto Github PK

View Code? Open in Web Editor NEW

688.0 688.0 38.0 134 KB

A jQuery plugin that adds random noise to the background of a given element.

License: MIT License

HTML 11.90% JavaScript 88.10%

noisy's People

Contributors

Stargazers

Watchers

noisy's Issues

Destroys gradients

Used with a gradient, the gradient disappears.

I'm using -webkit-linear-gradient(right bottom,#FAFAFA 46%,#DFE2F0 58%,#FAFAFA 87%) , with a basic animation:

    $(function () {
            var $fieldset = $('fieldset'),
                width = $fieldset.width();

            jQuery.fx.interval = 180;
            (function(){
                    $fieldset.css({backgroundPosition: 0});
                    $fieldset.animate({ backgroundPosition: width}, 40000, arguments.callee);
            }());
    });

When noisy is enabled (any settings), the gradient disappears; all you see is noise.

toDataURL in Android 2.2

toDataURL doesn't return anything in Android 2.2

Doesn't work on images

When attributed to an image, like so:
$('img')[0].noisy();

It should add a noisy foreground to the image.

Noisy will hang and consume as much CPU circles, as a available for intensities < 1 on certain sizes. Firefox (15) will ask to stop the script, Chrome (22) will sometimes notice for unresponsive tabs an offer to stop it, sometimes Chrome will just keep the script running till the tab is closed. Opera (12) also just keeps going, until the tab is closed.

I isolated this as a minimal test case:

<html>
    <body>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/noisy/1.1/jquery.noisy.min.js"></script>
        <script>
            $('body').noisy({
                'intensity' : 0.234,
                'size' : 100,
                'opacity' : 0.123,
                'fallback' : '',
                'monochrome' : true
            }).css('background-color', '#eaeaea');
        </script>
    </body>
</html>

I ran these tests to isolate intensity as the cause:

'size' : 99 hangs
'size' : 100 works
'size' : 101 hangs
'size' : 99 , 'intensity : '1.0 works
'size' : 100 , 'intensity' : '1.0 works
'size' : 101, 'intensity' : '1.0 works
'size' : 99, 'opacity : '1.0 hangs
'size' : 100, 'opacity : '1.0 works
'size' : 101, 'opacity : '1.0 hangs

JS error in IE 8: Object doesn't support this property or method

This from IE 8 when viewing http://rappdaniel.com/other/noisy-sample/ and my own local test page.

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C)
Timestamp: Wed, 9 Mar 2011 06:01:33 UTC

Message: Object doesn't support this property or method
Line: 125
Char: 12
Code: 0

URI: http://rappdaniel.com/other/noisy-sample/

This is running on a Windows 7 VM in VMware Fusion. The issue is that IE tries to execute the canvas.getContext function and then dies instead of pressing on to use the fallback image.

Broken button 'Download as PNG' in demo

@ demo page button "download as png" doesn't work. Tested in FF/Chromium under Ubuntu.

PS. Thanks for your work.

Use with excanvas.js?

Would it be possible to use this in conjunction with excanvas.js for IE? I've loaded excanvas but Noisy doesn't seem to notice. (It may be because of the other issue I just logged where the plugin isn't making it past line 6 in IE.)

Background image w/ no-repeat

Hey,

Is there any way to use Noisy on an element which already has a background image, set to no-repeat? Noisy just inherits the no-repeat.

Thanks!

'localStorage' is null or not an object on IE8

When trying to use Noisy on IE8 (document mode IE8 Standards) I get the following error: 'localStorage' is null or not an object.

The only way I could solve this was, on line 8, change the window['localStorage'] !== null to window['localStorage'] != null.

Screenshot: http://dl.dropbox.com/u/64927542/issues/noisy-ie8.png

storing the resulting 'image' on client side for re-use (?)

More an idea than an issue:
Did you think about storing the resulting image into the user's browser by using HTML5 Web Storage (http://davidwalsh.name/html5-storage)? - of course only for modern browsers, but it work even faster/smoother. LessCSS JS does this for example.

Update source at cloudflare.com

Could you please update the javascript at the cdn link provided in the readme.md file?

Link:

cdnjs.cloudflare.com/ajax/libs/noisy/1.1/jquery.noisy.min.js

The latest version of jQuery doesn't support .browser anymore, so the c.browser.msie part is causing an error.

Error in Firefox 6.0.1

In Firefox 6.0.1, I get a "Security Error" on line 1 of jquery.noisy-min.js. My code is just this:

$('body').noisy({
        'intensity' : 1, 
        'size' : 200, 
        'opacity' : 0.114, 
        'fallback' : '', 
        'monochrome' : false
}).css('background-color', '#bece62');

Appending background-image

Just a matter of curiosity:

Why did you append $(this).css('background-image') to the background-image property at this line? I think it's causing an error on IE8 when applying the fallback image.

Great plugin, by the way :)

danielrapp / noisy Goto Github PK

noisy's People

Contributors

Stargazers

Watchers

Forkers

noisy's Issues

URI: http://rappdaniel.com/other/noisy-sample/

Recommend Projects

Recommend Topics

Recommend Org

Jobs