CODEWITHSUNDEEP
javascriptjqueryfacebookdemogoogle-plus
lagrz
lagrz

Reputation: 79

How do I Google Plus and Facebook Demo opacity Javascript?

Recently Google+ and Facebook have added a nice feature that when a user first logs in and there are new features available it displays it as a demo mode of some sort highlighting the element in question and darkening or changing opacity on the rest of the screen as a means to focus on that element. It also shows step by step tooltips for the demo.

Does anybody know of an open source script or jquery plugin that does this already?

Upvotes: 1

Views: 391

Answers (2)

Ry-
Ry-

Reputation: 224962

I don't know of one, so I made one: http://jsfiddle.net/minitech/A9AAa/

It's pretty simple, call spotlightOn and pass the element on which the "spotlight" should "shine" as an argument. Call spotlightOff to turn the spotlight off.

It should degrade gracefully.

Upvotes: 1

ShankarSangoli
ShankarSangoli

Reputation: 69915

They basically block the UI and show an overlay on top of the whole page. You can try jQuery blockUI plugin it will help you block the page and then you can show an overlay on top of it.

http://plugins.jquery.com/project/blockUI

Upvotes: 2

Related Questions