1

I have a link on my page which, when clicked, opens a new tab with another page inside (which is not under my control). Since I redirected my user to this page I would like to explain to them now what they are supposed to do on this page ("Now please press the green button on this page."). I would like to open a dialog with the explanation. I can live with the user having to close this dialog prior to following the advice.

I tried using onclick="alert('<msg>');" in the link. But this first created the dialog and only when the user closed the dialog, the link got followed. The UX was disrupted. I could give a message like "You will now open a new window; on this please do the following …", but I would prefer to display the dialog over the new page instead.

I tried using an onclick="setTimeout(function() { alert('<msg>'); }, 3);" (as described in this answer). This actually opens the new page in a new tab but then switches back to my original one when the dialog appears asynchronously. This disrupts the UX again; I would of course prefer to have the dialog appearing over the new page.

Is there any way of achieving what I aim at? I would like to open the new page, have it visible, keep it visible, and then display an explanation to the user while the new page is visible. Is there any way to achieve this?

2 Answers 2

0

You have no control over the other page other than being able to redirect it, but as that is a security concern for many that probably isn't a good solution.

The only things you can change are what is on your website so there is no way of showing a dialog over the other webpage unless that page can take query strings and display them as alerts (highly unlikely).

You will need to go with one of your existing methods, or open the other website in an i-frame, if the other site allows that. That means you are still on your webpage and have full control over what happens. For example:

  • Click link
  • Open iframe in background
  • Show modal with instructions
  • User closes modal and follows instructions in iframe
Sign up to request clarification or add additional context in comments.

1 Comment

That was what I feared. Let's see if other answers show up.
0

You can create a page of your own (which will be used as a proxy) and it could request the other page. The response should be the structure of your page. This would be the first step.

The second step is to fix the relative locations used for img, iframe, script, link and a to use a full path, so the page will not break.

The third step is to write your JS library and add it to the header of the page. This library will do the messaging.

The fourth step is to open your new page in the new tab where you have control over what's happening.

2 Comments

Wow. That sounds like a bit too much for my usecase. I could never convince anybody of the need for that ;-)
@Alfe I can understand you, but this is the only solution I know about. I have applied this several times in my projects.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.