Reveal a Public Data Source in an Iframe Tutorial
There can be several reasons why you would not want to show, straight away, an HTML Iframe element in its final form, as the web page loads:
- It is important for the user not to see it yet. Maybe it is the answer to a clue you give in a game?
- You may not know how long it will take to load, so you don’t want a slow webpage immediately when the user can not judge what is going on.
- It is part of some surprise for the user.
- The Iframe data may be very dynamic and it is pointless to show the user any data until they click and get told that the data is a snapshot in time.
So one way to approach this is to use an Iframe like below (note the javascript:false; usage), as you load the webpage:
<iframe id=’myif’ src=”javascript:false;” frameborder=”0″ width=”100%” height=”600px” style=’display:none;’></iframe>
Then you can allow the user to click and reveal the data within the Iframe with a button or input type=button or an a HTML element, an example of which is shown below:
<a href=’#’ style=’color: pink;’ title=’Reveal’ onclick=’reveal();’>Show data below …</a>
So what might the Javascript reveal function (accessing the DOM) look like:
<script type=’text/javascript’>
function reveal() {
var myi = document.getElementById(‘myif’);
myi.style.display = ‘block';
myi.src = ‘//data.gov.au/dataset/6cdf7a25-4f2d-4bae-b3b5-61175e2b3b13/resource/839fd4c3-6b4a-4658-8671-dd974b5b4bb1/preview';
}</script>
An alternative to
myi.src = ‘//data.gov.au/dataset/6cdf7a25-4f2d-4bae-b3b5-61175e2b3b13/resource/839fd4c3-6b4a-4658-8671-dd974b5b4bb1/preview';
is to go
window.open(‘//data.gov.au/dataset/6cdf7a25-4f2d-4bae-b3b5-61175e2b3b13/resource/839fd4c3-6b4a-4658-8671-dd974b5b4bb1/preview’, ‘myif’);
or another alternative is to go
<a target=’myif’ href=’//data.gov.au/dataset/6cdf7a25-4f2d-4bae-b3b5-61175e2b3b13/resource/839fd4c3-6b4a-4658-8671-dd974b5b4bb1/preview’ … >
Thanks today go to the Australian Government data website which contains oodles of interesting data with good instructions on how to use it.
Link to some downloadable HTML programming code … rename to aust_public_example.html
If this was interesting you may be interested in this too.
I loved as much as you will receive carried out right here. The sketch is tasteful, your authored subject matter stylish. nonetheless, you command get bought an impatience over that you wish be delivering the following. unwell unquestionably come further formerly again as exactly the same nearly a lot often inside case you shield this hike.
Thanks for every other fantastic article. Where else could anyone get that kind of information in such an ideal method of writing? I have a presentation next week, and I am at the search for such info.
I am also writing to make you know what a extraordinary experience our daughter had using your blog. She figured out some things, which included how it is like to possess an awesome giving spirit to get the rest just have an understanding of several grueling things. You undoubtedly exceeded readers’ expectations. Thanks for supplying those beneficial, dependable, educational as well as cool thoughts on that topic to Gloria.
There is noticeably a bundle to know about this. I assume you made some nice points in features also.
Usually I don’t learn post on blogs, but I wish to say that this write-up very forced me to take a look at and do so! Your writing style has been surprised me. Thank you, very great post.
topics and also discuss it with us. I assume it will aid a bunch of individuals. Many thanks
I’m totally agree with your declaration or things that you have actually discussed below in this website.
I’m completely agree with your declaration or things that you have actually shared here in this internet site.
Hey there guys, newbie here. I’ve lurked about here for just a little although and thought I’d take part in! Looks like you’ve got quite a good location here
hi there, your internet site is discount. Me thank you for do the job
I went over this internet site and I think you’ve got plenty of fantastic details, saved to fav (:.
I wish to point out my love for your kindness in support of persons who should have help with this particular idea. Your special dedication to getting the solution all over turned out to be particularly functional and have really allowed somebody much like me to realize their aims. Your own helpful guideline means this much a person like me and especially to my office colleagues. Thanks a ton; from everyone of us.
Thanks for any other magnificent article. Where else may anyone get that type of info in such an ideal method of writing? I have a presentation subsequent week, and I am on the look for such information.
Hello there, You have done an excellent job. I’ll definitely digg it and personally recommend to my friends. I’m sure they’ll be benefited from this site.