Silverlight or jQuery or CSS

Today's Google logo (see attachment) is composed of unusual pictures that can pop open one by one maximized without a new window. Please advise how to do it in Silverlight or jQuery or CSS?
G122310.jpg
ksfokAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

TechnoBabbleCommented:
Simply put it is using CSS position. If you use Firefox and Firebug you will find they are all divs in a div with the popup (a href) causing the larger images to show up.

I hope this helps.
DesignbyonyxCommented:
All i can say is there is no need for Silverlight.

Once HTML5 and CSS3 are final, you will be able to do this without javascript.  You could even do it now, but browser support will be limited.

Your best bet is jQuery and CSS.  Here's the basic explanation:  You have a bunch of absolutely positioned DIVs, each containing an image.  Each DIV has a width and height which is smaller than the image. This is what gives the "cropping" effect.  Then, when a user hovers over the image, the DIV expands to show the entire image.  This requires javascript (jQuery), and is fairly simple.  You will also notice that when the DIV expands, the image is put on top of everything else.  This is accomplished using z-index to ensure that the current image has the highest stacking order (highest z-index).

Hope that helps.
ksfokAuthor Commented:
Please kindly provide full code details? Thanks.
Your Guide to Achieving IT Business Success

The IT Service Excellence Tool Kit has best practices to keep your clients happy and business booming. Inside, you’ll find everything you need to increase client satisfaction and retention, become more competitive, and increase your overall success.

ksfokAuthor Commented:
Please kindly provide full code details? Thanks.
MrunalCommented:
Hi
this can be achieved with all three options.
Pl. specify your requirement (where do you want to use this, location of this on page, etc)
OR
just you wan to achieve this as an example.
If you provide details this will be helpful to us.

And it is better to implement this with jQuery.

Here is sample application:

http://www.sohtanaka.com/web-design/fancy-thumbnail-hover-effect-w-jquery/

Hope you are happy now. :)

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
ksfokAuthor Commented:
I was intrigued by what I saw under the menu of product samples here:

http://www.starck.com/

How can we achieve what they did, especially position maximized sample over surrounding samples the way they did?
DesignbyonyxCommented:
Its all custom buddy ;)  Someone designs in, someone builds it.  There is no such thing ass clicking your heels together and getting something cool like that.  You can spend hours and even days searching for something on the web that does what you want, or you can spend the same time building your own custom piece of functionality.  By building your own, you 1) might actually learn something, and 2) have complete control over how you want it to behave.
ksfokAuthor Commented:
Can someone al least tell me how to maximize a picture to cover exactly a particular block of pictures?
Kumaraswamy RCommented:
This question has been classified as abandoned and is being closed as part of the Cleanup Program. See my comment at the end of the question for more details.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JScript

From novice to tech pro — start learning today.