|
JavaScript - Just Need A Little Extra To Make This Iframe Refresh Just Once...
Hi--
I have found a neat trick to refresh an iframe in an html page, but I just need one little twist to make it work just right. I would like to make the iframe content refresh just once, not matter how many times the link is clicked... Right now, I have this in the head: Quote: <script type="text/javascript"> function refreshIframe(el) { var f = document.getElementById(el) var rsrc = f.src f.src="about:blank" f.src=rsrc } </script> And this is the link which, when clicked, refreshes the iframe every time it is clicked: Quote: <a href="#page_7c" onclick="refreshIframe('test'); return false"> "test" is the id of the iframe. I am sure how to do this is really simple, but it escapes me... Many thanks! Similar TutorialsI have a page with 2 iframes how can I make it that if they submit on the first iframe - it should refresh the second iframe? This works on one of our other sites, but today I noticed this site is having a problem, its just not refreshing at all... here is the code.. (what is used on the iframe) Code: <iframe id="ad1" whats in the header (besides the including of the js file) Code: <script type="text/javascript">
var imageIntervals={};
var imageLimit={};
var imageCount={};
</script>
and the actual script Code: function toggleImage(id) {if(imageCount[id]<imageLimit[id]||imageLimit[id]<0) {var img=document.getElementById(id);img.src=img.src;imageCount[id]++;}else {clearInterval(imageIntervals[id]);}}
function setImageInterval(id, ms, limit) {imageIntervals[id]=setInterval("toggleImage('"+id+"')", ms);imageLimit[id]=(limit!==undefined?limit:-1);imageCount[id]=0;}
/* IFERAME RATES */
window.onload=function() {
setImageInterval("ad1", 72000, 4);
setImageInterval("ad2", 60000, 4);
setImageInterval("ad3", 66000, 4);
setImageInterval("ad4", 72000, 4);
setImageInterval("ad5", 72000, 4);
setImageInterval("ad6", 76000, 4);
}
This should work, but its not so trying to see if you can see something I dont. If theres a better iframe refresh script out there that can do different intervals, please share. Thanks Well first off all I would appricate any help that you could give me because I've been looking all over the internet for the solution without any result. So off to my problem, I made this text-based online game and let's say the user does a crime, he did this crime 17:04:30 and has to wait till 17:06:30 before he can do a crime again (this is printed in the MySQL database). Getting the value from the database and changing it into the right format mm:ss is no problem. The problem comes to when its about refreshing... I've tried meta refresh and javascript location.refresh with good results, i sat the timer to 1 sec and it refreshed. The problem comes to when it refresh the mouse cursor and the tab (in firefox and chrome) gets that look, like when u refresh a page normally u can see an hourglass and all that. Is there anyway to disable that? And i think it really slows the browser down after a while (because after like 30 min or more firefox used 600 mb of my RAM). So yeah here's my Iframe code: Code: print <<<ENDHTML <IFrame Src= "right_timer.php" Scrolling=No Frameborder=0 Marginheight=0 Marginwidth=0 Width=100% Height=160> <p>Your browser does not support iframes.</p> </iframe> Also here's the right_timer.php: Code: <?php
include("config.php");
$dbres = mysql_query("SELECT *,UNIX_TIMESTAMP(`crime`) AS `crime` FROM `users` WHERE `login`='{$_SESSION['login']}'");
$data = mysql_fetch_object($dbres);
if(! check_login()) {
print"<link rel=stylesheet type=text/css href=style.css>";exit;
}
if ($data->status == dead) { print"<link rel=stylesheet type=text/css href=style.css>";exit; }
?>
<html>
<head>
<meta http-equiv="refresh" content="1">
</head>
<body>
<?php
$dbres = mysql_query("SELECT * FROM `users` WHERE `activated`='1'");
$users= mysql_num_rows($dbres);
$dbres = mysql_query("SELECT * FROM `users` WHERE `status`='alive' AND `activated`='1'");
$levend = mysql_num_rows($dbres);
$dbres = mysql_query("SELECT * FROM `users` WHERE UNIX_TIMESTAMP(NOW())-UNIX_TIMESTAMP(`online`) < 300");
$online = mysql_num_rows($dbres);
$dbres = mysql_query("SELECT * FROM `users`");
while($blah = mysql_fetch_object($dbres)){
$time = time();
$crime = gmdate('i:s',($data->crime - $time));
if (($data->crime - $time) < 0) { $crime = Now; }
}
print <<<ENDHTML
<tr><td>Crime {$crime}</td></tr>
ENDHTML;
?>
</body>
</html>
Okay, I assume many will think I must have missed the previous thread, but I did look at it, and I am not sure if that one comes close to answering my idea here. I was looking at NHL.com, and I noticed the scoreboard changed without me reloading the page. So... I looked at the code, and this is where I got completely lost: Code: <div id="scoreboard">
<style type="text/css">
#masthead #richMedia, #scoreboard { margin-left: 0px; width: 817px; }
</style> <script src="/js/hdr_scoreboard.js?v=6" language="JavaScript" type="text/javascript"></script> <script language="JavaScript" type="text/javascript">
var dataSource = "http://live.nhle.com/GameData/PlayoffScoreboard.jsonp?loadScoreboard=?";
jQuery(document).ready(function() { initScoreboard(5, 'cc0000', '000000'); });
</script>
What I am interested in doing is reloading an iframe that has a total visitor counter. That way say every 5 minutes or so, it gets updated without any interaction needed. I tried the meta refresh on the iframe's target page long ago, but that forced a reload on the main page as well, and I am totally against doing that. So, does anyone here have any tips to provide? hi there. i have a classic asp page that is using the winhttprequest object to get the contents of website from a different server. Then i modify the html i get to suit my needs.. save it to a file, and then finally, i display this stuff in an IFRAME. (i wrapped a div tag around the iframe so technically, i'm doing something like: "divtabframe.innerHTML = '<IFRAME SRC='myserver/somepage.html'></IFRAME>) My problem is that when i refresh the main page, i want the iframe to also display the latest data. It does get the latest data from the external site and its saved in "somepage.html". But the iframe isn't updated unless i explicitly right-click inside the frame and manually select refresh. I have added a <meta http-equiv="refresh" content="30"> line to make it auto refresh on it's own. But the users find it annoying that the page refreshes while they're reading it. It would be ideal if when they refresh the main page, the iframe gets updated too. or i could create a new button too... as long as both pages are updated i did find this solution on a different website: document.getElementById(FrameID).contentDocument.location.reload(true); My page inside the iframe is ultimately "local" so it sounds like the above code should work, but i'm not sure what event would be best to trigger this javascript... and i still need a way to refresh the main page too. thanks. Hello Everyone, I am having trouble with a script that displays the url of an iframe. On this page, I have a single iframe and want to display the url of the iframe in a div. It works upon initial loading, but the url does not change when a link within the iframe is clicked and a new iframe page loads within the frame. My users need the ability to determine and directly link/view the iframe url. Here is the script Code: <iframe id="mainFrame" name="mainFrame" class="inner-center" frameborder="0" scrolling="auto" width="100%" height="400"
src="whats_new.htm"></iframe>
<p>
<div class="footer"><script type="text/javascript" language="JavaScript">
<!--document.write('<input type="text" style="width:100%; " ');-->
document.write( document.getElementById('mainFrame').src);
</script>
</div>
I am a js novice and trying to figure out what to research and implement. Can you reload the content in the div? do I want to look at cross-frame scripting? Any help would be greatly appreciated. Best regards, Eiger Alright I have an Iframe, and at the end of that Iframe I have set a variable with JS to be equal to TRUE, indicating that the page has run through the script. I then check that the iframe from the parent window for that variable, if it has not been set yet (or does not equal true) it reloads the iframe. The code works fine FF and Opera. However in IE it does not reload the frame if it is not true, and in Chrome it alerts undefined and does not reload the frame. I have tried accessing the frame through the dom and it did not work for me, and i have also tried simply adding a tail to the iframes source with no success. PHP Code: <iframe name="ifrOne" src="iframe.htm" id="ifrOne"></iframe> <script type="text/javascript"> function frameLoad() { var testOne = window.ifrOne.test_var; if(testOne !== "TRUE") { alert(testOne); document.getElementById('ifrOne').contentDocument.location.reload(true); window.frames['ifrOne'].location.reload(true); } } </script> I am building a webpage to make my life easier at work. In the page i am simply loading 3 different web pages that i use 100% of the time between each other, and since they are little tools and i can fit them all nicely in one. However, i'm having a problem doing it with the most important one. I've included all 3 pages via iframes, but the third page doesn't work and becomes the topmost every time. This is because this web page uses the Javascript code snipset below in their page: ---------------------------------------- if (top.location != self.location) { top.location = self.location.href; } ---------------------------------------- Please advise me if you have any solution for that. Many thanks, Arch, i'm working with a city select option, a hotel select option & an iframe. the hotel select option is populated depending on the chosen city which then updates the iframe src. this is all working fine. the trouble im having is that when the page is refreshed, normal f5 way, the hotel option changes whereas the city option & the iframe src remains the same?? this problem does not occur on a force refresh via control + f5 as then both select options & iframe src revert to their original state. I don't want the city option to change upon a normal page refresh. how do I go about this? below are the city, hotel select options & iframe Code: <form name="hotelslist" id="hotelslist">
<select id="cities" name="cities" onChange="hotel_list(hotelslist.cities.selectedIndex);loadHotel();">
<option value="Baddeck">Baddeck</option>
<option value="Banff">Banff</option>
</select>
<select id="hotelnames" name="hotelnames" onChange="loadHotel();">
<option value="Inverary Resort, Baddeck">Inverary Resort, Baddeck</option>
</select>
</form>
<iframe name="hotelframe" id="hotelframe" src="http://www.google.com" scrolling="no" width="660" height="1000" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0"> <p>Your browser does not support iframes.</p> </iframe>
below is my javascript functions Code: function loadHotel() {
var destURL = document.hotelslist.hotelnames.options[document.hotelslist.hotelnames.selectedIndex].value;
window.frames["hotelframe"].location = destURL; }
var i;
function hotel_list(i){
var hotelslist = document.getElementById("hotelslist");
hotelslist.hotelnames.options.length=0;
switch(i)
{
case 0: //Baddeck
hotelslist.hotelnames.options[0] =new Option('Inverary Resort, Baddeck','http://www.test0.com');
break;
case 1: //Banff
hotelslist.hotelnames.options[0] =new Option('Banff Caribou Lodge & Spa','http://www.test1.com');
hotelslist.hotelnames.options[1] =new Option('Banff Ptarmigan Inn','http://www.test2.com');
hotelslist.hotelnames.options[2] =new Option('Banff Rocky Mountain Resort','http://www.test3.com');
hotelslist.hotelnames.options[3] =new Option('The Rimrock Resort','http://www.test4.com');
hotelslist.hotelnames.options[4] =new Option('Fairmont Banff Springs','http://www.test5.com/');
break;
}
}
can some one please advise on a cross browser solution? thanks in advance. Omar. Hi. I am new here. I wanted help for a JavaScript code. You might think I'm lazy for not writing it myself, but the truth is I am not a JavaScript coder. I just have a really simple website and I am trying to do something for which I know JS is required but I don't know how to do it. I've also searched around but couldn't find the appropriate code. What I want to do is to make an html page load a different background image every time it refreshes. I will have a list of background images and I want to be able to add in this list, without having to change anything else in the codes after I do this (I think this is made by making an array of images and by putting .length somewhere in the codes, but I don't know exactly how I should do this). I already know how to do an external file (.js) and link to it from my .html page. Now I want the code to put in the .js file, and the code to put in the <body> of my .html file. Please help me Thanks I have a php file lets say file1.php, that printing a variable, its dynamic numbers output that already always increasing, like private message numbers that coming or others : PHP Code: <?php echo $variable ?> i want to put that variable output, in another files page title, lets say file2.php or file3.html, in the front of the another files page titles, and auto refresh every x seconds, maybe like this : Quote: (1) - another text in the page title after x seconds, get a private message Quote: (2) - another text in the page title after another x seconds, get another private message Quote: (3) - another text in the page title or its ok if just like this, only the variable, without the another text in the page title Quote: (1) please share your knowledge to make it, maybe using javascript, jquery or others I'm using ApTabs. My problem is long pageload times because I have IFrames as DIV content. How can I make "IFrame Tabs" so pages load when tabs are click instead of preloading?
Hello I have several issues with my multilevel drop down menu The First issue is : the page has 2 iframes (one has the horizontal multilevel drop down menu on the top) the below iframe has my site address Now, when i hover over the menu it does not open or expand but when i open just the menu without any iframes it does This clearly means that the menu is not coming out of the iframe Please help me bring it on top of everything of the page Note: i have placed the menu in one iframe and a page opens below it in another iframe. The Second issue is : I want the navigation bar that is the multilevel drop down menu to be editable Which means i have a blog and a forum on my site but my visitor wants that the blog should not appear there and another link to play games should be there and hence he/she can edit it And please also try to make it work on cookies so that the user info and preferences are saved in cookies and whenever he/she comes back they see the page their way. For you: I would like to tell you that IdeaLab has launched a Twitter Advertising, Widget and Search platform and the first 1000 people are getting $100 go to tweetup.com Please help me, it will be really appreciable. Thank you very much in advance! Okay, I'm trying to refresh my iframe ads, 3 of them. The code works, its just making the functions work "per" ad. When it refreshes, it changes "all" ads, I want them to refresh at different RATE Code: function reloadFrames(first, refresh){delay = 0.2; //minutes to delay the refresh
max_refreshes = 3; if (max_refreshes > refresh){refreshed = refresh + 1;setTimeout("reloadFrames(false, refreshed)", delay*60*1000); if (!first) {ads = document.getElementsByName("ad");for(var i=0; i<ads.length; i++) {ads[i].src = ads[i].src;}}}
}
function reloadFrames2(first, refresh){delay = 1; //minutes to delay the refresh
max_refreshes = 3; if (max_refreshes > refresh){refreshed = refresh + 1;setTimeout("reloadFrames(false, refreshed)", delay*60*1000); if (!first) {ads = document.getElementsByName("ad2");for(var i=0; i<ads.length; i++) {ads[i].src = ads[i].src;}}}
}
function reloadFrames3(first, refresh){delay = 1.4; //minutes to delay the refresh
max_refreshes = 3; if (max_refreshes > refresh){refreshed = refresh + 1;setTimeout("reloadFrames(false, refreshed)", delay*60*1000); if (!first) {ads = document.getElementsByName("ad3");for(var i=0; i<ads.length; i++) {ads[i].src = ads[i].src;}}}
}
ad codes: Code: <iframe frameborder="0" marginwidth="0" marginheight="0" scrolling="no" width="728" height="90" src="http://ad.103092804.com/st?ad_type=iframe&ad_size=728x90§ion=656647" name="ad"></iframe> <iframe frameborder="0" marginwidth="0" marginheight="0" scrolling="no" width="120" height="600" src="http://ad.103092804.com/st?ad_type=iframe&ad_size=120x600§ion=656647" name="ad2"></iframe> <iframe frameborder="0" marginwidth="0" marginheight="0" scrolling="no" width="160" height="600" src="http://ad.103092804.com/st?ad_type=iframe&ad_size=160x600§ion=656647" name="ad3"></iframe> Is this possible to get each iframe to refresh at a different rate, or even combine the functions into one? I dont code much javascripts. Thanks -Tim Hey, I have two iframes like this: iframe1 = chat window iframe2 = form to enter text to chat Now currently i have iframe1 with a meta refresh on every 1 second. But i've seen live chats before with JS which are not refreshing the page all the time or so it appears...what i mean by this as the meta refreshes the first iframe my browser shows a status bar and loading symbol on firefox, but an old js chat i saw which wasn't free script didn't do this it was pure smooth and didn't look like it was refreshing all the time even if it was it hid it well. How was that done because my method sucks incomparison with make a live chat look "live". Hope you can help me. Hi, I have the below code: Code: <script type="text/javascript">
function loadQuickMessageCheck(File,ID){
var xmlhttp;
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
}
else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById(ID).innerHTML=xmlhttp.responseText;
eucalyptus = setInterval(function(){loadQuickMessageCheck(File,ID)},20000);
}
}
xmlhttp.open("POST",File,true);
xmlhttp.send();
}
</script>
But I am overloading the server and crashing it. I've googled the issue and have found people with similar problems who talk about the need to cancel the last refresh request before they send the next refresh. I even found this nice piece of code which worked for someone else. Quote: try{window.clearTimeout(tRefresh)} catch(err) {} tRefresh = setInterval(setContext, varInterval*60*1000); } I am not sure if this is the solution that I am looking for but if it is all my attempts at applying this code has been a bit of a disaster. Is there a way to resize an iframe dynamically so that you never get the scroll bar and essentially hide that there is an iframe? Better integration really. Basically I want to iframe a forum into my site so that the design down the sides and top which my friend does using iweb are not messed with. We have a central area which can be longer or shorter depending on the forum. Hi all, I hope you can help I have some code which: 1) Opens a URL (e.g. google.com) in a hidden iframe, then 2) Redirects the visitor to a different URL (e.g. yahoo.com) after it has loaded... This works exactly as I need. What I'd like to do is the following: 1) Open a URL (e.g. google.com) in a hidden iframe, then 2) Redirect the visitor to a different URL (e.g. yahoo.com) in a full-screen iframe 3) The address bar of the full-screen iframe should be my domain (obviously!) Here's what I have so far... Hidden iframe -> New URL Code: Code: <html>
<body>
<script type="text/javascript">
var page_body = document.getElementsByTagName('body');
var myframe = document.createElement('iframe');
var id = Math.random();
myframe.setAttribute('id', 'myFrame'+id);
myframe.src = 'http://google.com'; //First open Google in hidden iframe
myframe.setAttribute('frameborder', '0')
myframe.setAttribute('width', '0');
myframe.setAttribute('height', '0');
if (myframe.attachEvent)
{
myframe.attachEvent('onload', function()
{
top.location = 'http://yahoo.com'; //Once loaded redirect to Yahoo -- but the address bar shows yahoo.com -- I want the address bar to display mydomain.com/page.html
});
}
else if (myframe.addEventListener)
{
myframe.addEventListener('load', function()
{
top.location = ('http://yahoo.com');
}, false);
}
page_body[0].appendChild(myframe);
</script>
</body>
</html>
I have an example of some code which displays the full screen iframe, but my problem is... ...I can't figure out how to redirect to this after the hidden iframe has loaded Here's an example of how I want the redirect to display -- after the initial hidden iframe has loaded: Code: <html>
<head>
<script type="text/javascript">
function sendParams() {
document.body.style.overflow = "hidden";
}
</script>
</head>
<body>
<!--Open Yahoo.com in a full screen iframe, and disable extra scrollbar -->
<iframe height="100%" width="100%" frameBorder="no" onload="sendParams()" src="http://yahoo.com"></iframe>
</body>
</html>
I've been beating my head against the wall today trying to figure this out, and I'm fresh out of ideas. If you can help, you'll have some serious gratitude and good karma thrown your way! Best wishes, and thanks in advance, Paul Hi there everybody, I've got this problem which I can't solve myself... I've got a website which has 3 colums and is hosted on domain1.com. in the right column I've got an Iframe which loads content from domain2.com . this content are some textboxes and a datepicker tool. if I press the 'search'-button in this Iframe I would like to refresh the mainpage (from domain1.com) so that another Iframe appears in the middle column. in this column i would like to load a new form from domain2.com which contains the values that I've put in in the form from the right Iframe. Unfortunally I can't get this to work... Will somebody please help me? I have used iframes for my site and found various javascripts so when a person clicks on say the audio page he http://www.krillmeed.com/index.html it takes them to the audio page but will load it into the index.html page. The problem is, especially with search engines, to point to that page, this is what the URL looks like to send someone to that page: http://www.krillmeed.com/?frame=0&sr...m%2Faudio.html which is not very clean at all, this is the javascript that i found that at least works: Child iframe script: Code: <script type="text/javascript">
(function(){
var qstr = '?frame=0&src=' + encodeURIComponent(location.href),
lre = new RegExp('^' + location.protocol + '//' + location.hostname + '(()|(/)|(/index.html)|(/index.php))(()|(\\' + qstr + '))$');
if (!lre.test(parent.location.href)){
top.location.href = '/' + qstr;
}
})();
</script>
Parent iframe Script: Code: <script type="text/javascript">
(function(){
function getQval(n) {
if(typeof n !== 'string'){
return null;
}
var r = new RegExp('[?&;]' + n + '=([^&;#]*)'), m = location.search;
return (m = r.exec(m))? unescape(m[1]) : null;
}
var f = getQval('frame'), s = getQval('src');
if(f && frames[f] && s && s.indexOf(location.protocol + '//' + location.hostname + '/') === 0){
frames[f].location.href = s;
}
})();
</script>
Is there a "cleaner" way of doing this? This was an old code, i have yet to find a more modern one. Thank you in advance. |
|||||||