Menu icon Foundation
reveal external link

Hi,

I can't get external links to work in the ajax modal like http://foundation.zurb.com/forum/posts/1170-reveal-ajax (closed thread) says.

I implemented iframes like in the videomodal example. Only to discover . . .

1. that this way al my 40 external URLs are preloaded, which is of course annoying. I can't get even the most basic (below) to work.

2. Some URL's seem to try to escape all framing/pop-up/modal's. This raises the question if this is because of javascript they have implemented? Common practice in the good old Netscape days.

3. additional question, for when this issue is sorted:
How can I stop Reveal from preloading large numbers of external url content (which it does by default)?

Just to prove my foundation setup is okay: Sticky top bar and Harmonica work fine on my local beta pages which I tested stand alone and online.

Thanks in advance.

Best regards

Dieter

<p>1. iframe modal - works fine
<p>
<a href="#" data-reveal-id="modal1">
Click Me For A iframe Modal
</a>
<!-- hidden tbv modal -->
<div id="modal1" class="reveal-modal xlarge" data-reveal="">
<iframe id="iframe1" width="950" height="500" src="http://some-external-domain/" frameborder="0"></iframe>
<a class="close-reveal-modal">&#215;</a>
</div>

<p>2. Ajax modal - same link, only launches modal background, nothing further
<p>
<a href="http://some-external-domain/" data-reveal-id="myModal" data-reveal-ajax="true">
Click Me For A Ajax Modal
</a>
<div id="myModal" class="reveal-modal" data-reveal>
<a class="close-reveal-modal">&#215;</a>
</div>
            

         

revealmodalAJAX

Hi,

I can't get external links to work in the ajax modal like http://foundation.zurb.com/forum/posts/1170-reveal-ajax (closed thread) says.

I implemented iframes like in the videomodal example. Only to discover . . .

1. that this way al my 40 external URLs are preloaded, which is of course annoying. I can't get even the most basic (below) to work.

2. Some URL's seem to try to escape all framing/pop-up/modal's. This raises the question if this is because of javascript they have implemented? Common practice in the good old Netscape days.

3. additional question, for when this issue is sorted:
How can I stop Reveal from preloading large numbers of external url content (which it does by default)?

Just to prove my foundation setup is okay: Sticky top bar and Harmonica work fine on my local beta pages which I tested stand alone and online.

Thanks in advance.

Best regards

Dieter

<p>1. iframe modal - works fine
<p>
<a href="#" data-reveal-id="modal1">
Click Me For A iframe Modal
</a>
<!-- hidden tbv modal -->
<div id="modal1" class="reveal-modal xlarge" data-reveal="">
<iframe id="iframe1" width="950" height="500" src="http://some-external-domain/" frameborder="0"></iframe>
<a class="close-reveal-modal">&#215;</a>
</div>

<p>2. Ajax modal - same link, only launches modal background, nothing further
<p>
<a href="http://some-external-domain/" data-reveal-id="myModal" data-reveal-ajax="true">
Click Me For A Ajax Modal
</a>
<div id="myModal" class="reveal-modal" data-reveal>
<a class="close-reveal-modal">&#215;</a>
</div>
            

         
Peter Knight over 4 years ago

I believe theres an issue with opening external pages within the modal.
If you try to modal a page from the same server it'll work. External sources load the background and no modal (as you explained).

Looking for a solution myself.

Rafi Benkual over 4 years ago

Ho Peter or Dieter or anyone else, Can you please a link, or set this up so we can replicate it? We're happy to take a look, just need the demo so we can replicate it.