Home/ Questions/Q 7815055
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-02T05:23:36+00:00

This is classic iframe code. All I want is to show different things when

  • 0

This is classic iframe code. All I want is to show different things when you click different links.

I want to display different galleries in wordpress on a page with different links. I don’t wanna code different html’s for each of them

<iframe id="myIframe" src="about:blank" height="200" width="500"></iframe>
<br />
<a href="http://www.blogger.com" target="myIframe">Blogger</a><br />
<a href="http://www.cnn.com" target="myIframe">CNN</a><br />
<a href="http://www.google.com" target="myIframe">Google</a><br />
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    What you’re trying to do is show and hide specific parts of the page when clicking on a link. You don’t need to use iframes for that. I think you’d better use hidden div’s for this, or maybe even an ajax call to load the different galleries. I’ll show you the hidden divs approach :

    <div id="gallery1" class="gallery">
  A whole lot of html that makes up the 1st gallery
</div>
<div id="gallery2" class="gallery" style="display:none">
  A whole lot of html that makes up the 2nd gallery
</div>
<div id="gallery3" class="gallery" style="display:none">
  A whole lot of html that makes up the 3nd gallery
</div>

<a href="JavaScript:void(0)" data-gallery="gallery1">Show gallery 1</a>
<a href="JavaScript:void(0)" data-gallery="gallery2">Show gallery 2</a>
<a href="JavaScript:void(0)" data-gallery="gallery3">Show gallery 3</a>

​
$('a').click(function() {
  $('.gallery').hide();
  $('#' + $(this).data('gallery')).show();
});

    Here’s a js fiddle: http://jsfiddle.net/nV5vy/

    • 0