[Webinar] Streamline your web hosting managementRegister Today

x
?
Solved

Popup To Display Home Page Of External Site

Posted on 2014-11-17
2
Medium Priority
?
260 Views
Last Modified: 2014-12-03
Use case:  When a visitor hovers over a link, a popup is revealed, showing the current home page of the link.

1) What's the best approach?
2) Any downside to offering this UI experience? Like will affect page load?
3) Also want this to be scalable. I may want to add social media links at the bottom of the popup window.

Popup
0
Comment
Question by:sandshakimi
2 Comments
 
LVL 4

Expert Comment

by:Hiran Desai
ID: 40449548

1. What's best approach?

Well that depends on type of website you are developing. But think of customer or reader's point of view. There shall be not too much information neither too little. It has to be as much as reader is looking for. Showing popup on link is good but make sure that two links are placed at an interval such that two popup aren't opened at the same time. Keep your key information in readable place which shall not be hidden from viewer at anytime. So you can think of opening popup at any specific location so that it not affect readability.

2. Any downside

As I said, It may be like customer don't like that to be opened at someplace.
Page Load Slow? It depends on how are you implementing. Don't download content directly. Let it be lazy loaded. Try using JavaScript with Popup having IFrame in that. Set src attribute only when a mouse is hovered.

3. Want to scale it by adding social links

That shall not be the issue. It's separate and logic is going to be all yours. So definitely doable. (Y)
0
 
LVL 34

Accepted Solution

by:
Big Monty earned 1500 total points
ID: 40450091
I've used a jquery plug-in called Lightview for this very type of thing. It's light weight, easy to set up and configure, and the documentation is pretty good.

http://projects.nickstakenburg.com/lightview
0

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

591 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question