Link to home
Start Free TrialLog in
Avatar of futr_vision
futr_vision

asked on

Is it possible to create a web page that can act as an overlay on another webpage?

I was thinking about creating a webpage that could load up as an overlay on another webpage. I'd want the overlay to be interactive like a normal webpage. Is this possible? Would I be able to read data from the loaded page and display it in the overlay?
Avatar of jmcmunn
jmcmunn
Flag of United States of America image

what do you mean by "an overlay" on another webpage?  Do you mean like a modal window popped up over top of the other?  You can easily do that with jQuery....

http://jqueryui.com/demos/dialog/modal-form.html
Avatar of Dave Baldwin
You could have a very fancy web page to do that but pretty much by definition, you can only have 1 web page in a window.
Well...technically you can load a separate page in an iframe or whatever and have multiple "pages" within a single page.  But I don't think that's the goal here.
Avatar of futr_vision
futr_vision

ASKER

Take something like a stock trading website for instance. They have a lot of features and while they have help sections they often require a click off the page or opening up another window/tab. Now the company can choose to enhance their help if they choose but often they don't. If I wanted to teach someone in layman's terms how to use the various features it would be cool to load up the site in the background and overlay text help, tutorials, videos and such right on top of the page they are accessing. I know it gets more complicated when you start trying to map the div to specific portions of the page but for now I'd be content knowing I could do the overlay. I'm not opposed to smaller overlayed divs either.
You could absolutely hide/show divs using jQuery.  When a user clicks a help link just set the visibility of a div based on its ID (or several based on class).  And of course if you're tricky with css and jquery you could have them "animate" as they apear, or slide in or whatever.

One such super simple example is here...
http://papermashup.com/demos/jquery-sliding-div/#

There are tons of other examples out there, and of course it gets fancier than that as well.
The hiding and showing divs shouldn't be a problem. What might be tricky is that I want to be able to overlay these divs on websites other than my own. In the example above I would want a user to be able to log into their stock account and load up the overlay or on the flip side log into a service on my site and then log into their stock account.
Well, you're talking about more than display issues unless you're planning on iframes or something "transparent" to the user for loading pages from different servers that don't belong to you.

But still, you should be able to set a z-order on a div and slide it anywhere on the screen using an absolute position I imagine.  Kind of an odd scenario.  I would say that if anything it would be confusing to the user.  It might be better to just have a navigation bar on your site on one side, load the external page in an iframe and then have the help be either pop-up windows, jquery modal forms, or just display the help in the side bar.

Generally a user doesn't care how "slick" the help feels as long as it is good content and gets them the info they need.  Just my personal experience.

Good luck though!
Hmmm. I wonder if browser plugins might be a way to go.
Maybe I could use text to trigger divs when text is present and maybe alt text for images.
ASKER CERTIFIED SOLUTION
Avatar of futr_vision
futr_vision

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
No one answered my last question.
Maybe it is too late ask this but what do you do with the Win 8 reserved partition with the above scenarios? i don't plan on using bitlocker. Is there any benefit to having it and if not how do you get around Windows automatically creating it?