JavaScript - Show Div Within An Iframe
On my page there's an iframe containing a div which I've hidden with code on the actual iframe page. I want the iframe content only to be accessible by clicking a button on the main page.
Here's the main parts of the code: Within the iframe: Code: <html> <head> <script language="javascript"> <!-- var state = 'none'; function showhide(layer_ref) { if (state == 'block') { state = 'none'; } else { state = 'block'; } if (document.all) { eval( "document.all." + layer_ref + ".style.display = state"); } if (document.layers) { document.layers[layer_ref].display = state; } if (document.getElementById &&!document.all) { hza = document.getElementById(layer_ref); hza.style.display = state; } } //--> </script> </head> <body onload="showhide('div')" style="display: none;"> <div id="div" name="div"> Some Content... </div> </body> </html> And on the main page: Code: <html> <head> </head> <body> <div id="div1"> <iframe onload="iFrameHeight()" id="blockrandom" name="iframe" src="http://somewhere.com/" width="100%" height="500" scrolling="auto" align="top" frameborder="0" class="wrapper"> This option will not work correctly. Unfortunately, your browser does not support inline frames.</iframe> </div> <div id="div2"> <input type="button" value="Show/Hide Search" onclick="document.getElementById('blockrandom').contentWindow.showhide('div')"> </div> </body> </html> The page hides successfully but I can't get it to show again from the button on the main page. If there's something wrong with my code or if there was a way that the iframe page could check if it was loaded on the right page or not would be great although i'm not sure if that's possible. Any solutions or alternatives are welcome. Thanks. P.S. This is on Joomla CMS, I don't think it should make a difference but correct me if I'm wrong. Similar TutorialsI have an iFrame on which I wish to display scrollbars ONLY when the mouse is over the iFrame AND the source of the iFrame is larger than the iFrame can display I am using the following code for the iFrame but believe that I need to add some script to make it work: Code: <iframe src="http://www.mhgoebel.com" frameborder="0" id="frame" width="320" height="356" scrolling="no"> onmouseover="setScrolling('auto')" onmouseout="setScrolling('no')" </iframe> I'm setting up an application that involves blog posts with comments boxes appended to the div that contains the posts. The comments boxes are in iframes and load an html file on the same domain. There are multiple posts/boxes on each page. I need a javascript that will only run the append script when the posts are written and appear on the page. So in non js language, I'm looking for this: if div id post#5 appears on the page, show the iframe that contains the comments box that goes with post number 5. else don't show it. I don't know enough javascript to figure this out so if anyone could point me in the right direction, I'd be grateful. Hello codingforums, There are various widgets and plugins that show link preview via tooltip or iframe, So as I am trying to continuously improve web sites experience with new trends and web functionalities - thus it come the task for uniform link preview via div and iframe. This is the script that use attribute id's but for the complete solution it would be required to display link within event 'this' or something -any suggestions and help are very appreciated. Thanks Code: <script type="text/javascript"> function toggleDiv(divid){ var div = document.getElementById(divid); div.style.display = div.style.display == 'block' ? 'none' : 'block'; } </script> <div class="toggle"><a href="javascript:toggleDiv('panel1');" >Toggle Panel 1</a></div> <div id="panel1" class="panel"> <h2>Panel 1</h2> This panel contains text </div> <div class="toggle"><a href="javascript:toggleDiv('panel2');" >Toggle Panel 2</a></div> <div id="panel2" class="panel" style="display:block;"> <h2>Panel 2</h2> This panel contains external url content <iframe src="http://" width="100%" heigth="500"></iframe> </div> <div id="panel1" class="panel"> <h2>Panel 1</h2> This panel starts closed because style='display:none' is defined in the style section of the head </div> <div class="toggle"><a href="javascript:toggleDiv('panel2');" >Toggle Panel 2</a></div> <div id="panel2" class="panel" style="display:block;"> <h2>Panel 1</h2> This panel starts open because of style='display:block' </div> <a href="javascript:toggleDiv('panel1');" >Another Link to Toggle Panel 1</a> [/CODE] Hello all I am new here but this place looked great and like one of the only places where I could find the answer to my question. I have created a page which pulls search results from various sites using PHP. It displays each result in a row in a table upon running. I wanted to add a button saying "More information" at which point, a div would appear and load the associated link for that search result within an iframe within the newly appeared div. I've been able to get a div appear and disappear on button click but, I couldn't get it to dynamically load an iframe on click with the associated search results link. Any suggestions are greatly appreciated. Also let me know if you need more information before assisting. Thanks! 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 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? 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 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. Hi, Not sure if I worded that question right. I have a web page which will display another web page in an iframe. But the content inside the iframe may change while the user interacts with it so I need to be able to resize the iframe height from code on the page inside the iframe. Any tips on how I can do that? I am using php and javascript. Thanks. Hello to all and thanks in advance for my help. I know this has been posted in different places on the web but I have found no solid solution. Here is my problem: I have an iframe the loads up a page on a remote server (out of my hands) and when I send certain information to it, the page redirects my entire site to their 404 page. I need to prevent this from happening so I engaged in much research and found this... temporary fix: Code: <script> // No redirection! var prevent_bust = 0 window.onbeforeunload = function() { prevent_bust++ } setInterval(function() { if (prevent_bust > 0) { prevent_bust -= 2 window.top.location = 'http://www.mysite.com/my404.html' } }, 1) </script> What this code does, is that every time the unload of a page happens, it will redirect me to my404.html and this does solve the problem of the iframe trying to redirect my entire site but anytime a user tried to go to a new website by typing it in the address bar, they are redirected to my404.html. Is there another solution for me so that the page within the iframe cannot redirect the parent page? I have an iframe that is a specific height and width. I want to detect whenever the the iframe is no longer exactly the height i set it to. If a user has CSS turned off for example the iframe will be in default height and width. I want to detect that. This is how you'd normally do it but this only returns the original size (try with 'no style' in Firefox): Code: function getSize() { alert('height is now '+document.getElementById("Iframemain").height) alert('height is now '+document.getElementById("Iframemain").width) } Is it possible? Hello.... I've 2 iframes. And i want to change the css class of second iframe anchor tag from the first. Code: <div id="top-navigation" title="top-navi"> <ul><li id="homePageLink" class="first"> <a id="homePageTab" class="navigation-font" href="</a> </li> </ul> </div> In the above code how can i change the class="navigation-font" from the first iframe? Please help.... Hi I have a page with 3 iFrames, showing different content. iFrame1: Here is a navigation php page. Click on a menu item and it loads a php page in iFrame2 iFrame2: Here is a list of items from a database. iFrame3: I load 3 different php pages here. (A) is the main showing page. (B) and (C) is a record manipulation page, that does some editing in the database and then redirects to (A). When the (A) php page loads, it should reload iFrame2 I have tried to put something like: <body onLoad=parent.location.reload()> and put it on the (A) php page. This will reload the entire page, which works. However, it results in a loop of reloads, as the (A) iFrame file will load with the entire page reload... So, I was looking for the right code to put, like onLoad=iFrame2.location.reload() However, I can't seem to find the correct code, so I hope any of you can help me... How do I show the default icon for pdf, doc, etc... else show the image? Code: Show the default icon for pdf, doc, etc... else show image. Default icon: '<img alt="" src="images/icons/' + sIcon + '.gif" width="16" height="16" border="0"><\/a>' + The image: '<img alt="" src="' + fileUrl.replace( /'/g, '\\\'') + '" height="36" border="0"></a>' + Attempted javascript onError but only certain browsers support that or it's my code. Code: '<img alt="" src="' + fileUrl.replace( /'/g, '\\\'') + '" height="36" border="0" onerror="this.src=images/icons/' + sIcon + '.gif"></a>' + Any ideas? Hello all, I have this code where you click on a state and it gives you haunted places for that state. Here's my HTML code: Code: <img src="media/us_map.gif" border="0" usemap="#map" style="border:1px solid #999999;padding:5px;background-color:white;"/> <map name="map" id="map"> <area onclick="me();" title="Maine"shape="poly" coords="532,77,522,52,525,51,527,47,526,38,525,29,528,18,532,20,536,15,541,18,546,34,560,45"Maine" /> <area onclick="nh();" title="New Hampshire" shape="poly" coords="517,83,517,64,523,56,532,81,519,86"New_Hampshire" /> <area onclick="vt();" title="Vermont" shape="poly" coords="502,58,505,78,508,84,511,92,519,88,516,66,520,55"Vermont" /> <area onclick="ma();" title="Massachusetts" shape="poly" coords="543,91,546,94,538,98,533,94,532,92,512,100,512,93,533,81,518,86,531,85,538,87"Massachusetts" /> <area onclick="ri();" title="Rhode Island" shape="poly" coords="528,95,531,104,536,98,531,94"Rhode_Island" /> <area onclick="ct();" title="Connecticut" shape="poly" coords="513,101,515,111,529,104,528,96,524,97"Connecticut" /> <area onclick="ny();" title="New York" shape="poly" coords="529,110,519,118,510,119,494,104,453,114,449,109,455,104,453,97,458,94,471,92,479,85,472,78,480,75,481,67,498,61,490,62,501,61,504,78,511,92,510,100,514,110,514,114,511,112"New_York" /> <area onclick="nj();" title="New Jersey" shape="poly" coords="501,134,507,140,512,125,509,123,511,114,502,109,500,112,497,121,505,127,506,125,500,132"New_Jersey" /> <area onclick="de();" title="Delaware" shape="poly" coords="495,136,500,152,507,148,498,134"Delaware" /> <area onclick="md();" title="Maryland" shape="poly" coords="502,167,506,156,507,149,501,153,492,137,460,142,460,148,465,147,473,144,479,146,483,147"Maryland" /> <area onclick="pa();" title="Pennsylvania" shape="poly" coords="463,150,458,119,464,114,468,119,509,110,515,115,512,126,518,132,512,140"Pennsylvania" /> <area onclick="wv();" title="West Virginia" shape="poly" coords="436,176,429,167,432,159,447,145,458,145,447,149,459,145,461,150,470,147,464,160,457,162,452,178"West_Virginia" /> <area onclick="va();" title="Virginia" shape="poly" coords="427,190,437,178,450,180,458,163,465,162,471,146,485,150,495,163,502,176"Virginia" /> <area onclick="nc();" title="North Carolina" shape="poly" coords="418,216,431,214,439,207,450,206,455,208,468,209,484,221,487,217,497,205,501,204,511,193,505,176,446,185,441,198,432,197,420,212"North_Carolina" /> <area onclick="sc();" title="South Carolina" shape="poly" coords="430,215,436,220,445,230,457,238,459,250,485,221,470,210,449,205,438,208"South_Carolina" /> <area onclick="ga();" title="Georgia" shape="poly" coords="415,275,415,251,405,216,429,215,445,231,455,238,459,251,456,267,451,272,450,276,445,272"Georgia" /> <area onclick="fl();" title="Flordia" shape="poly" coords="387,275,386,283,398,282,409,284,416,290,429,282,439,289,445,292,445,311,456,326,462,335,470,341,463,351,471,349,479,339,481,325,476,310,470,298,462,284,458,270,452,275,445,272,418,277,413,271"Florida" /> <area onclick="al();" title="Alabama" shape="poly" coords="377,284,374,221,403,218,412,247,413,272,389,272,384,282"Alabama" /> <area onclick="ms();" title="Mississippi" shape="poly" coords="341,277,348,260,345,251,346,234,354,221,373,220,376,285,365,288,362,278"Mississippi" /> <area onclick="la();" title="Lousiana" shape="poly" coords="313,297,319,278,312,266,311,246,316,250,342,250,347,259,342,278,361,279,364,289,363,297,368,302,358,303,348,305,341,294,330,302"Louisiana" /> <area onclick="tn();" title="Tennasee" shape="poly" coords="356,220,361,200,372,199,445,187,442,198,432,196,419,216"Tennasee" /> <area onclick="ky();" title="Kentucky" shape="poly" coords="363,198,365,191,370,191,371,182,386,178,405,160,415,165,427,164,436,178,424,189"Kentucky" /> <area onclick="oh();" title="Ohio" shape="poly" coords="407,160,400,124,413,121,423,125,431,123,439,116,447,143,431,159,430,163,415,162,421,163"Ohio" /> <area onclick="mi();" title="Michigan" shape="poly" coords="381,124,387,112,381,101,381,89,395,68,400,73,405,76,410,86,405,95,406,103,414,91,419,101,420,111,412,122"Michigan" /> <area onclick="mi();" title="Michigan" shape="poly" coords="341,62,353,70,366,74,367,85,371,70,381,70,390,64,399,66,400,54,360,46"Michigan" /> <area onclick="ind();" title="Indiana" shape="poly" coords="375,180,375,129,384,125,400,124,408,160,388,177"Indiana" /> <area onclick="il();" title="Illinois" shape="poly" coords="364,192,356,184,348,177,350,170,344,169,334,154,338,150,339,138,347,127,344,124,340,120,368,116,373,130,375,180,368,180,369,189"Illinois" /> <area onclick="wi();" title="Wisconsin" shape="poly" coords="339,121,335,106,319,91,316,78,324,73,322,65,336,59,364,77,365,90,373,80,367,113,368,116"Wisconsin" /> <area onclick="mn();" title="Minnesota" shape="poly" coords="286,108,286,86,280,80,283,74,280,33,298,33,323,45,343,43,322,66,324,73,316,80,318,90,337,107"Minnesota" /> <area onclick="ia();" title="Iowa" shape="poly" coords="285,108,284,123,292,148,337,148,338,138,346,127,341,120,335,107"Iowa" /> <area onclick="mo();" title="Missouri" shape="poly" coords="293,150,301,157,299,163,309,171,305,198,354,200,352,207,360,206,365,194,347,177,349,171,344,169,334,154,339,148"Missouri" /> <area onclick="ar();" title="Arkansas" shape="poly" coords="309,243,307,199,352,203,348,208,358,207,356,220,346,234,344,247,314,248,341,248,318,251"Arkansas" /> <area onclick="nd();" title="North Dakota" shape="poly" coords="215,73,219,31,278,32,281,76"North_Dakota" /> <area onclick="sd();" title="South Dakota" shape="poly" coords="209,112,216,74,279,77,285,85,282,121,276,115,270,117,264,114"South_Dakota" /> <area onclick="ne();" title="Nebraska" shape="poly" coords="209,136,210,113,264,114,267,116,275,117,282,122,292,152,294,154,229,152,226,142,228,139"Nebraska" /> <area onclick="ks();" title="Kansas" shape="poly" coords="227,192,227,152,294,155,301,159,294,163,309,172,304,197"Kansas" /> <area onclick="ok();" title="Oklahoma" shape="poly" coords="213,199,214,192,306,199,309,244,291,241,271,243,256,235,246,233,247,202"Oklahoma" /> <area onclick="tx();" title="Texas" shape="poly" coords="168,258,170,270,184,280,188,296,201,303,212,294,224,294,242,318,253,338,274,348,273,324,312,299,317,278,310,268,311,245,290,242,276,245,255,237,245,233,246,203,213,200,209,259"Texas" /> <area onclick="mt();" title="Montana" shape="poly" coords="115,16,110,30,120,50,115,61,123,61,129,82,148,79,211,86,218,30"Montana" /> <area onclick="wy();" title="Wyoming" shape="poly" coords="137,127,145,79,213,87,209,105,209,138"Wyoming" /> <area onclick="co();" title="Colorado" shape="poly" coords="153,184,161,132,227,140,228,149,226,191"Colorado" /> <area onclick="nm();" title="New Mexico" shape="poly" coords="140,261,153,182,213,190,208,257,151,253,149,263"New_Mexico" /> <area onclick="idaho();" title="Idaho" shape="poly" coords="79,105,90,74,86,73,99,61,95,49,106,13,114,16,109,27,119,49,115,60,122,64,128,82,145,81,136,114"Idaho" /> <area onclick="ut();" title="Utah" shape="poly" coords="98,175,111,112,135,113,135,125,160,130,153,184"Utah" /> <area onclick="az();" title="Arizona" shape="poly" coords="80,236,117,255,135,263,152,186,99,174,92,192,89,191,89,214"Arizona" /> <area onclick="wa();" title="Washington" shape="poly" coords="34,34,41,37,44,47,95,51,105,12,60,1,57,14,51,20,49,11,38,6"Washington" /> <area onclick="or();" title="Oregon" shape="poly" coords="79,102,11,85,34,34,42,37,42,49,94,52,98,62,85,72,89,77"Oregon" /> <area onclick="nv();" title="Nevada" shape="poly" coords="53,98,42,134,87,199,89,190,93,191,97,174,110,112"Nevada" /> <area onclick="ca();" title="California" shape="poly" coords="78,234,51,233,41,209,30,198,21,197,21,185,13,166,14,158,7,150,6,108,12,88,53,97,42,135,87,200,85,216"California" /> <area onclick="ak();" title="Alaska" shape="poly" coords="0,370,133,345,101,312,84,315,69,256,26,252,6,252,0,252"Alaska" /> <area onclick="hi();" title="Hawaii" hape="poly" coords="139,322,159,355,193,364,221,362,197,331,158,320"Hawaii" /> <area onclick="dc();" title="Washington DC" shape="rect" coords="514,182,535,196"Washington DC" /> <area onclick="md();" title="Maryland" shape="rect" coords="517,160,540,174"Maryland" /> <area onclick="de();" title="Delaware" shape="rect" coords="531,141,550,156"Delaware" /> <area onclick="nj();" title="New Jersey" shape="rect" coords="519,125,538,138"New_Jersey" /> <area onclick="ct();" title="Connecticut" shape="rect" coords="532,113,549,125"Connecticut" /> <area onclick="ri();" title="Rhode Island" shape="rect" coords="558,94,571,108"Rhode_Island" /> <area onclick="ma();" title="Massachusetts" shape="rect" coords="549,72,568,86"Massachusetts" /> <area onclick="nh();" title="New Hampshire" shape="rect" coords="502,29,522,42"New_Hampshire" /> <area onclick="vt();" title="Vermont" shape="rect" coords="476,29,496,44"Vermont" /> </map> </td> <td valign="top"> <div style="text-align:left; width:412px; height:362px; border:1px solid #999999;padding:10px;background-color:white; overflow:auto;margin-left:5px;" id="states"><span>Click a state to the right to see where that state's haunted places are.</span></div></td> So what happens is you click on a state and it will show what's under that states line inside this JS file: http://www.pxlcreations.com/paraguide/map.js That works fine but if I try and put lots of text inside it, it won't work. I have to put each state inside this and here's what alabama looks like: http://www.pxlcreations.com/paraguide/alabama.html So here's a quick recap. If I try and put the Albany data into the JS file, it won't show. I even tried this: Code: <!--#include virtual='alabama.html'--> But that didn't work either. Thanks in advance! my javascript clock suddenly disappeared. I don't know what happened. It's an external file. I have<script language="javascript" src="main.js"></script> in the head section of my html and the .js looks like this but it's not showing up. I haven't made any changes unless I'm just remembering wrong function startTime() { var now = new Date(); var h=now.getHours(); var min=now.getMinutes(); var s=now.getSeconds(); var ampm=(now.getHours()>11)?"PM":"AM"; var d=now.getDay() var y=now.getFullYear() var mon=now.getMonth() var dm=now.getDate() if (h>12) h-=12; if (h==0) h=12; if (min<10) min="0"+m; if (s<10) s="0"+s; if (dm<10) dm="0"+dm; if (d==0) d="Sun"; if (d==1) d="Mon"; if (d==2) d="Tues"; if (d==3) d="Wed"; if (d==4) d="Thurs"; if (d==5) d="Fri"; if (d==6) d="Sat"; mon+=1; document.getElementById("time").innerHTML=h+":"+min+":"+s+""+ampm+" "+d+" "+mon+" "+dm+" "+y; t=setTimeout('startTime()',1000); } function checkTime(i) { if (i<10) { i="0" + i; } return i; } I'm having some problems hiding a div block and displaying another one. this is my first attempt and creating something with JavaScript with out using a tutorial or anything so i would really appreciate any help, so i can learn what i want is to have a div block display initially so when a user goes to the page they see the registration form, but if they already have an account they can just click a link that says log in and the registration form hides and the login form shows. However right now its only hiding both and not displaying anything when the link is clicked Here's the javascript code i'm using Code: <script type="text/javascript"> function toggleview(id) { var login = document.getElementById(id); var regsiter = document.getElementById(id); if(id == 'login' ) login.style.display == 'block'; regsiter.style.display == 'none'; } </script> And here is what my link looks like Code: <h4><a href="#" onclick="toggleview('login')">Allready Have an Account?</a></h4> does not work in iframe, the error described he http://groups.google.com/group/ie7-j...73a3e?lnk=raot if I do correction as suggested then the error dissapears, but does not work (hover). Anyone found solution for that ? Hello Experts I need your advice. I dont know if this is the write place to post my query. But I have an assignment due today. I have got everything working except an iframe that is driving me nuts. the question on the assignment asks to insert a command to write the HTML code <iframe src='weekday.htm'></iframe> to the webpage where weekday is the text string returned by the weekDay() function. The iframe should display the daily schedules that are stored in the sunday.htm through saturday.htm file. The weekDay() function is located in an external .js file that I have already linked to my webpage. Another thing is there is no weekday.htm file instead there are files sunday.htm through saturday.htm that have the daily schedules to de displayed in the iframe. I know that I should some link the weekday.htm file to the weekDay() function. This is what I have done so far: <h2 id="title">Today at the Union</h2> <p> <script type="text/javascript"> /* Dispaly the daily schedule in an inline frame. Display schedules are stored in the files sunday.htm through saturday.htm */ <iframe src='weekday.htm'> var weekday = weekDay(); document.write(weekday); </iframe> </script> </p> Please advice as to how to get this thing working. I am not an expert( I am still learning.) I tried my best (spent several hours breaking my head on this). So any help is much appreciated. Thank you for your time Hi Am new to javascript. I have a requirement where user clicks on a image which should direct to iframe. Please follow 2 scripts and please advice how to open iframe link instead of link in window.open Image code: <img src = "../samples/images/Edit3.png" alt = "Edit Status" height = 13 width = 13 onclick = "window.open('../cgi-bin/cognos.cgi?b_action=cognosViewer&ui.action=run&ui.object=%2fcontent%2ffolder%5b%40name%3d%27NARM%27% 5d%2fpackage%5b%40name%3d%27TM1_NARM_RISK_DASHBOARD_CREDIT_FINANCE%27%5d%2ffolder%5b%40name%3d%27Cre dit%20Finance%20Overlay%20Reports%27%5d%2freport%5b%40name%3d%27%23%2060%2b%20Rate%27%5d&ui.name=%23 %2060%2b%20Rate&run.outputFormat=&run.prompt=true','KPIDetail','width=600,height=350,scrollbars=yes,left=300,top=300')"> Iframe code: <iframe src="http://tm1lab.us.hsbc/TM1Web/TM1WebMain.aspx?AdminHost=tm1lab.us.hsbc&TM1Server=narm_risk_dashboard&action=OpenObject&type=Webshe et&value=Applications/CF_Commentary/H60Rate" width="100%" height = "100%" scrolling=no > </iframe> |