jQuery Growl 1.0.1 Released

Posted in: JavaScript,jQuery |

The first ‘stable’ release of jQuery Growl has been posted to the jQuery Plugins Repository. This release does not bring any ‘major’ new features to the table, but it does bring with it a nice long ‘testing phase’ where the plugin has been tried, tested and proven to work on a number of ocassions.  There is one new feature, which is the ‘close’ link that can now be included in the noticeTemplate — this link, when available, has a ‘click’ event assigned to it which calls ‘notice.remove()’ when clicked.

Also, James over at Honest Illusion has written up some decent documentation for the plugin, just ignore the ‘rant’ about my lack of documentation and skip to the good part … thanks again James.

On that note, if you’ve been using jQuery Growl on your site, please leave a comment on my blog and let me know.  I’d love to see some of the implementations that have come about since the creation of the plugin.  Thank you.

Google Chrome, Rendering Glitch

Posted in: Google Chrome |

 

I noticed the other day at the office, after installing Google Chrome, that the browser had a slightly obnoxious rendering glitch.  It’s apparent when viewing the jQuery Growl demo page.

Basically, it boils down to this … Chrome renders PNG’s exactly as one would expect it too, the same way that Safari and Firefox handle them … transparencies are … you got it, transparent!

Do you remember the ugly IE PNG bug where it doesn’t know how to handle the transparency layer and treats the alpha pixels ‘oddly’, almost randomly picking a color of choice and replacing your alpha pixel with a 100% opaque color? Well, looks like Chrome has a similar bug, at least … visually.

When jQuery Growl appends a new notification element to the DOM, and then fades it in … Chrome goofs the rendering up and makes the transparent pixels … non-transparent.  It appears to only do this on pixels that are not 100% transparent (opacity = 0). See the screenshot below for an example:

 

Chrome Render Bug

Chrome Render Bug

 

As you can see, the corners are 100% transparent … but everything else is not … since the background image has a weird glow/drop shadow effect on it … and you can see the notifications above it that have there CSS opacity set to 100, the PNG renders perfectly.

This bug appears to be present when the DOM Element’s opacity is set to anything other then 100, such as a jQuery fadeIn or fadeOut animation that is executing.

Nice, eh?

Hopefully, they fix this bug in the next beta …

WordPress Growl … thoughts?

Posted in: JavaScript |

I am currently working on integrating my recently released ‘jQuery Growl‘ with WordPress 2.5, as an administrative plugin.  Allowing a logged in Site Admin (User Level >= 10) to be notified of system messages such as ‘Comment Posted’, ‘User Logged In’, ‘Post Published’, etc … as well as allowing the site administrator to enable the ‘whose looking’ feature which will just log all requests to the site and notify the administrator of every page request …

Now, due to the large number of requests that would be created if this was ‘literally real-time’, I’m thinking of limiting the checks to every 10 seconds (possibly providing an override in the options?) and only retrieving the last 10 notices … if any of them are found in your current ‘notice stack’, then it will ignore it — keeping the internal ‘notice stack’ to 10 items or so.

With that said, I’m curious as to whether or not this is a useless feature, or if people would actually use it :)

So, let me know.

jQuery Growl 1.0 Released

Posted in: JavaScript |

I’ve just released jQuery Growl 1.0 ‘Preview’ and submitted it to the jQuery Plugin Repository. jQuery Growl is a jQuery based version of Growl for OS X.

The ‘home page’ for this plugin is currently located here on Fragmented Code.

I have lots to do to ‘finish this up’, but this is a pretty solid ‘preview release’ and is now open to the general public. I implemented something very close to this at the office on Friday, and just couldn’t resist releasing a jQuery Plugin (the one at the office uses jQuery, but is tied heavily into the ‘framework’ we’re building there — its currently proprietary, so … don’t bother asking, but we may release bits and pieces to the public at some point).

A co-worker likes to point out my ‘lack of support for IE’ when I release code snippets, and … as such, he pointed out the same ‘lack of support’ with my jQuery Growl ‘demo’ template … my response is,

if you can get IE to act right, I’ll support it

With that said, the demo looks a little ‘odd’ in IE — however, the demo uses a ‘custom’ template, the default template works perfectly fine (last I checked it, which was a while ago, *shrug*). The demo is a perfect example of ‘templating’ the output though … and your welcome to create as many IE-friendly templates as you want …

And, on that note … if you create any custom templates, please, let me know, I’d love to show case them with the plugin …

LinkShare  Referral  Prg - default banner