JQuery - make an element go "fuzzy"

Hey,

I have recently been developing a website for a company, with a full administration front end / CMS. In the Admin frontend, which unfortunately I cannot show you for security reasons, there is a Range list, Collection list and Design list. I would like to make the links for these work with JQuery, so clicking "Ranges" brings the Range list to the front and fades out the currently active list, making it fuzzy at the same time. I would like to make it so that the Range list is in front of the other lists by default, at about 50% opacity (wild guess). However with 50% opacity you would still be able to see the text behind it (in the other lists). I would like the text in the background (the "behind" lists) to be grey and fuzzy, like the effect I just noticed if you have a Windows Photo Viewer window in front of Windows Live Mail - the status text a the bottom right of Windows Live Mail is fuzzy, and quite obviously on the window behind). I would also like the text in the foreground to be black and in focus. Changing text colour is easy (peezy lemon squeezy!). I have done a quick Google on "JQuery fuzzy" and similar terms but found nothing.

Can anyone tell me if there is a way to do this (preferably as simple as $(selector).fuzz(50%);)?

Thanks in advance.

Regards,

Richard

"not that anybody would want this" - well I want it because it adds a really neat effect (or can do, if used with the correct combination of other effects). What I want to do is for it to look as though one list is getting closer and becoming more focused whilst the one which was previously focused is getting further away and the writing is kinda blending together. It ought to give it a kinda futuristic effect.

ClarkeyBoy 2010-08-25 14:08:54

@ClarkeyBoy I know what you want - you were quite clear in the question. Its just that a effect like this would be hardly be beneficial considering that opacity can be used for the same effect. Oh, and I stand by my words - 'its a really neat effect' isn't a good reason to add this sort of effect, even if it existed, to your forms. Why do you even *expect* this sort of things to be available?

Yi Jiang 2010-08-25 14:41:45

Why do I expect this sort of thing to be available? Well because there are such neat things you can do with JQuery or JQuery UI, like sliding elements, creating tabs out of lists and alike that I thought it MAY be possible. I was simply asking in case I was missing something. Before you point it out, I appreciate that tabs and things like that are created simply by using JS to add or remove elements in the dom and to create the blur effect would require a lot more processing etc etc - I just thought that amongst the vast library that is JQuery it may be possible to do this, thats all.

ClarkeyBoy 2010-08-25 14:52:50

PS I am not a noob, even though I may sound like one. This is my first project and I have a couple more lined up - my experience of .net spans over 2 years, starting when I was on a paid work placement. My experience of JQuery is somewhat limited because there was no need for it on the placement (I worked for a council which has to be accessible to as close to everyone as possible) so the only experience I have had of it was a couple of months earlier this year when I had some spare time. I have also had 3 years experience of PHP and am about to finish a degree in computing.

ClarkeyBoy 2010-08-25 14:58:51

@ClarkeyBoy Sorry if I was rude. There are far too much questions here asking about if jQuery could do ridiculous things. The way jQuery and jQ UI can have 'nice effects' is purely based on CSS - jQuery, and as an extension, all of Javascript, can only manipulate the styles applied to elements. Things like what you asked for, even if possible given the processing needed, would not be possible with Javascript alone, not even with a vast library. Before asking questions about jQuery's capabilities here I'd suggest you look them up on... <continue>

Yi Jiang 2010-08-25 15:00:39

The jQuery UI homepage as well as pages that document CSS3's capabilities, like http://www.css3.info/.

Yi Jiang 2010-08-25 15:02:08

You didnt really come across as rude as such, just like you'd reached the end of your patience. I felt a bit like I was being treated as a "hobbyist" (thats my insult towards the developers of sites I think look naff!! hehe). I thought if I tried here then if anyone knew of a jQuery plugin to do this then they would have a chance to post too. I wouldve posted on here even if I had looked and found jQuery itself couldnt do it - was just saving myself the time involved in looking is all. Thanks for your help. Richard

ClarkeyBoy 2010-08-25 15:08:04

ansaurus

tags:

views:

answers:

JQuery - make an element go "fuzzy"

related questions