bearduk
msg:4494921 | 10:20 pm on Sep 13, 2012 (gmt 0) |
Sorry, just to mention the src= for the iframe will contain a url such as [test.com...]
where everything is static except the GETID part which hopefully pulls in the variable.
|
daveVk
msg:4495063 | 7:46 am on Sep 14, 2012 (gmt 0) |
No need for iframes(unless cross domain), load content direct to div with
$("#show").load(url);
where url contains getid
[api.jquery.com...]
var getid = $(this).attr('id');
or just
var getid = this.id;
|
bearduk
msg:4495357 | 10:09 pm on Sep 14, 2012 (gmt 0) |
Thanks daveVK.
Unfortunately, the iframe is a requirement as the site being used is for a Uni and the iframe is embedded code that MUST be an iframe.
I've now found a cool little snippet that will not load the iframe until clicked:
<script type="text/javascript">
jQuery(function(){
$("iframe").each(function(){
this.tmp = this.src;
this.src = "";
})
.closest('.kiscourse')
.click(function(){
var frame = $(this).find("iframe")[0];
console.log(frame); frame.src = frame.tmp;
});
});
</script>
and the action show the iframe is:
<script type="text/javascript">
$(document).ready(function(){
$('.kisw').hide();
$('.button').click(function(){
$(this).parent().find('.kisw').toggle();
});
});
</script>
HTML
<!-- start course -->
<tr>
<td>
<div class="kiscourse">
Accounting AND Applied Psychology | NC48
<button class="button">Show / hide stats</button>
<div class="kisw">
<iframe id="unistats-widget-frame"
title="Unistats KIS Widget"
src="http://stg.unistats.eduserv.org.uk/Widget/10007767/UACCAAPS/horizontal/small" scrolling="no" style= "overflow: hidden; border:0px none transparent; width: 800px; height: 160px;" </iframe>
</div>
</div>
</td>
</tr>
<!-- end course -->
|
daveVk
msg:4495417 | 6:34 am on Sep 15, 2012 (gmt 0) |
There is a chance that the iframe may have started loading prior to you setting this.src="". It would be safer to have no src= on iframe.
|
bearduk
msg:4495850 | 5:43 pm on Sep 16, 2012 (gmt 0) |
Cheers daveVK,
there are hundreds of these iframes that I need on the page. I think I'm going to use DataTables jquery plugin.
As far as the iframe goes, each snippet of iframe code is published by another system and so I may put the iframe in a hidden separate div and then I'll use .attr to get it and insert it into the actual visible iframe.
A bit messy but I think it should work.
Thanks again
|
bearduk
msg:4495918 | 7:52 pm on Sep 16, 2012 (gmt 0) |
Final working code for anyone who finds it useful:
<script type="text/javascript">
$(document).ready(function(){
$('.kisw').hide();
$('.button').click(function(){
//starting from (this) button search for the .kisurl and get its href
kisurl = $(this).parent().find('.kisurl').attr('href');
// kisurl = alert($(this).parent().find('.kisurl').attr('href'));
// toggle div holding the iframe
$(this).parent().find('.kisw').slideToggle();
// find the nearest unistats id and change its src to the variable above
$(this).parent().find('#unistats-widget-frame').attr('src', kisurl);
});
});
</script>
<tr>
<td>
<div class="kiscourse">
Accounting AND Applied Psychology | NC48
<button class="button">Show / hide stats</button>
<div class="kisw">
<a class="kisurl" href="http://stg.unistats.eduserv.org.uk/Widget/10007767/UACCAAPS/horizontal/small">KIS Link</a>
<iframe id="unistats-widget-frame" title="Unistats KIS Widget" src="" scrolling="no" style="overflow: hidden; border:0px none transparent; width: 800px; height: 160px;"></iframe>
</div>
</div>
</td>
</tr>
|
|
