3

I'm trying to display an map inside an iframe that has a needle which on mouseover shows some information about a certain company, the thing is once you click the link the page opens up inside the iframe which ruins the experience, so i was wondering is it possible to make the links inside an iframe open up in a new window instead perhaps using jquery or something similiar?

the code i have atm is

http://www.jsfiddle.net/rkd59/1/

Edit: the very least capture a click within the iframe so i might resize the iframe

Breezer
  • 10,410
  • 6
  • 29
  • 50

6 Answers6

6

You will need some kind of open API to do this properly, and Eniro doesn't provide one according to this page (in Swedish).

I would recommend you to use the Google Maps API v3 instead. I've made an example on jsFiddle that looks similar to that of Eniro.

I'll gladly give you more help with this, so just ask away!

mekwall
  • 28,614
  • 6
  • 75
  • 77
  • 1
    Well this is alot better then i've could have imagined to accomplish – Breezer Jan 09 '11 at 21:46
  • @Breezer: I'm happy to hear! I promise you'll have great fun learning Google Maps API - it's incredibly powerful! :) – mekwall Jan 09 '11 at 22:09
  • 5
    @SteveFenton link is broken. redirecting to home page. please update. – Mr_Green Mar 06 '14 at 11:23
  • your link is broken... – Chrisk8er Dec 01 '21 at 01:59
  • link is broken and to be quite honest: adding google maps to do something like this sounds like adding bloat. I can't afford adding something like for that a simple web page – Bowiemtl Dec 13 '22 at 08:36
  • @Bowiemtl This answer is very specific to the user's test scenario, so I agree that it is not a good answer based on the question asked. Also, Google Maps was free to use back in 2011. I suggest you look for a more recent solution. – mekwall Dec 31 '22 at 12:55
  • @mekwall I figured it out in the meanwhile, thanks! The content in the iframe is controlled by the same domain so it's as simple as adding "allow-popups" in the sandbox attribute and adding '' to the content to make sure all links follow this behaviour – Bowiemtl Jan 03 '23 at 11:02
3

You can't (or it is extremely hard to ) make events inside the iframe affect the parent page. This is to prevent attacks from XSS, or cross site scripting. Having said that, if the site within the iframe is on your own domain and you want to set up some extremely tricky ajaxing and php session IDs, maybe you could make something work, but even then I'm not sure. And I don't know if this would be a security hole, maybe someone else can speak to that. It would perhaps look like:

  1. main page sets up session ID and passes that to the iframe url via a get variable
  2. the iframe takes click information and sends it to a Session variable via an ajaxing call to a script on the server.
  3. The main page then reads (how?) the session cookie and makes changes based on it's value.

All in all, you may find that it may be much simpler and more secure to acheive what you want using a different method.

JakeParis
  • 11,056
  • 3
  • 42
  • 65
  • within the same domain it is actually fairly simple.. You just have the script/function located in the parent document and then call it with parent.functionname() from the child frame... But as this would be on the same domain you would have access to both documents code.. – CarpeNoctumDC Jan 08 '11 at 08:45
  • there must be at least possible someway to capture a click within the iframe's dimension not neccersarly on a link just an click within Δx,Δy – Breezer Jan 08 '11 at 13:29
  • @Breezer your comments puts in mind a kind of overlay _over_ the iframe, which would make it _look_ like you are clicking on the iframe items, but in reality you are clicking on the overlay. But of course, then none of the clicks are going to register in the framed webpage. – JakeParis Jan 09 '11 at 02:28
  • yeah that's kind of the issue =/ – Breezer Jan 09 '11 at 05:23
1

Please try the following:

<script>
x=document.querySelectorAll("a");
for(i=0;i<x.length;i++)
{
   x[i].setAttribute("target","_blank");
}
</script>

Thus all links open in new frame.

warvariuc
  • 57,116
  • 41
  • 173
  • 227
Justin Levene
  • 1,630
  • 19
  • 17
1

Due this map is loaded inside an iFrame, it's not possible to run any javascript event listeners on the links, neither is it possible to change the html.

Yves Van Broekhoven
  • 344
  • 1
  • 3
  • 13
0

To make a link popup in a new window you would usually use target="_blank" as such:

<a href="http://www.yahoo.com" target="_blank">Go to Yahoo</a>

However this will only work if you can modify the code you're showing within the iFrame

m.edmondson
  • 30,382
  • 27
  • 123
  • 206
  • As a side note, `target` attribute is currently deprecated as of HTML 4.01, and consequently XHTML v1.x, but it will be brought back in HTML5. – mekwall Jan 09 '11 at 19:13
0

There is a partial solution.

You can add an absolutely positioned DIV tag over the top of the IFRAME and capture clicks on this instead. See example here shaded in 20% alpha red.

http://www.jsfiddle.net/rkd59/6/

However, this means that the map works in "read-only mode" and while you can capture the click event you wont know what link the user has clicked on.

Steven de Salas
  • 20,944
  • 9
  • 74
  • 82