JavaScript - Javascript, Iframes, And Page Jumps, Oh My!
I have a website, the main page of which we'll call Parent_page. Within Parent_page there's an iFrame, the name of which is the_iframe. The default source of the_iframe is a page which is default.html.
I want to supply people with a URL that: Step 1) Opens Parent_page displaying a source in the_iframe that is NOT default.html (that different source will be called different.html) Step 2) Then -- and this is the troublesome part -- does a page jump to element #12345 within different.html. I've managed Step 1. Here's the Javascript I'm using in the head of Parent_page to allow for Step 1 to happen: <script type="text/javascript"> function loadframe(){ if(window.location.replace) window.frames.the_iframe.location.replace(get('framepage')); else window.frames.the_iframe.location.href=get('framepage'); } function get(key_str) { var query = window.location.search.substr(1); var pairs = query.split("?"); for(var i = 0; i < pairs.length; i++) { var pair = pairs[i].split("="); if(unescape(pair[0]) == key_str) return unescape(pair[1]); } return null; } if (location.search&&get('framepage')!=null) if ( typeof window.addEventListener != "undefined" ) window.addEventListener( "load", loadframe, false ); else if ( typeof window.attachEvent != "undefined" ) window.attachEvent( "onload", loadframe ); else { if ( window.onload != null ) { var oldOnload = window.onload; window.onload = function ( e ) { oldOnload( e ); loadframe(); }; } else window.onload = loadframe; } </script> ...and here's the URL I use that opens different.html in the_iframe instead of default.html: mywebpage.com/parent_page.html?framepage=/different.html Again, that part works just fine. However, to accomplish Step 2, I thought I could just use: mywebpage.com/parent_page.html?framepage=/different.html#12345 But when I do that, suddenly nothing after the ? in the URL works. How can I make this page jump happen? Please, please dumb down your answers! I know HTML decently enough, but I don't know anything, whatsoever, about Javascript. The JS code above I copied from another website. Thanks! Similar TutorialsWhen my page loads, it automatically jumps down as if it were jumping to a named anchor. It's more apparent on longer pages (doesn't replicate if page fills screen). Happening in Win FF/IE/Chrome Disabling stylish-select.js (from http://www.prismstudio.co.uk/2009/05...x-replacement/ where he used to allow comments but not anymore) fixes it, but I don't know enough Javascript to debug, would really appreciate if somebody could have a look. Good example at http://studiohodson.com/projects/Bea...restaurant.php Script is at http://studiohodson.com/projects/Bea...lish-select.js Thank you thank you! Hello everyone,i will try to exaplain you what i am trying to do: I am building a web site in html5 and right now i am working in drag n drop some images from one iframe to another.Until now everything worked great.Today i connected my first iframe with my database so all the pictures are taken from there.For this reason, in my code, i create several <div>,each one with id>=1. My code for this is the following: Code: echo "<div class=\"drag\" id=\"".$info['id']."\" draggable=\"true\"><img src=\"postImages/".$info['id'].".jpg\" class=\"post\"></div>"; Its in php,but my results from chrome are the following: Code: <div class="drag" id="2" draggable="true"><img src="postImages/2.jpg" class="post"></div><<div class="drag" id="1" draggable="true"><img src="postImages/1.jpg" class="post"></div><div class="drag" id="3" draggable="true"><img src="postImages/3.jpg" class="post"></div><div class="drag" id="4" draggable="true"><img src="postImages/4.jpg" class="post"></div> So,so far i created several <div>s with one class "drag" and different ids starting from 1 until 4. And here start my problems!I have to change my code for the drag and drop functions in javascript in order to create a specific array with objects with id the <div> id.In more details,my code so far: Code: var people = { Seth : { blog : "http://google.com", photo: "postImages/1.jpg" } Seth2 : { blog : "http://google.com", photo: "postImages/2.jpg" } }; What i want is the SECOND iframe to create an array named people,but insead of Seth and Seth2 the objects inside to have ids 1,2,3... from my <div>s from the previous iframe. I am trying so many hours for this one (it is obvious that my javascript skills are not that good..) that i dont know what to do..i would be glad if you could help me! Thanks in advance! Hi, ok i been playing around with this for awhile now http://www.dynamicdrive.com/dynamici...iframessi2.htm could not get it to work, so i tried several others and still nada, i finally ran across http://www.codingforums.com/archive/.../t-224293.html and i worked with what old pendent had done. The result is that i got some good results, closer to what i wanted but i need to do it multiple times. It works for one but not the other. i thought about putting each iframe on a sep html page and then using two sep tables and doing a SS include. but there has to be a better way. what im doing is i have an amazon iframe and a shopzilla iframe for the same product search and i want them posted one under the other iframe iframe and expand as the size needs, alowing for either to be longer or shorter when needed. i can do one but i have not found a way to do both yet. i removed my code because it showed my personal affiliate info in the code, since i cant give you an example without showing the code i guess ill just use the auto scroll and live with it... thanks A few weeks ago, I posted a request for a basic script that I could use to load bible references into the browser depending on the current date (1 reading/week) as part of my Duke of Edinburgh award scheme project - I'm 15 and have started helping out with the local church website as part of my community service for the award. I know the basics of html, and a very little bit of Javascript/C++ When I posted the request, I was very quickly provided with a script that I am very grateful for, from Philip M (I think). We have just decided to attempt to implement the script into the website, and I am struggling a little bit with using Iframes in Javascript. Is there any possibility that somebody could give me a hand? (The test week is currently 49). The code works perfectly aside from the iframe loading. Code: <html> <head> <script type = "text/javascript"> function showWeekText() { var texts = new Array(54); // array index starts at 0 which is unused texts[1] = "Iframe for Week 1"; texts[2] = "Iframe for Week 2"; texts[3] = "Iframe for Week 3"; texts[4] = "Iframe for Week 4"; texts[5] = "Iframe for Week 5"; //6-48 removed for ease of viewing texts[49] = <iframe src ="http://mobile.biblegateway.com/passage /index.php?search=matthew%203:1-6&version=NIV" width="90%" height="4 <p>Your browser does not support iframes.</p> </iframe>"; // Iframe i wish to use for week 49 (Iframe works in an empty html page, but unsure how to use in javascript script) <iframe src ="http://mobile.biblegateway.com/passage/index.php?search=matthew%203:1-6&version=NIV" width="90%" height="4 <p>Your browser does not support iframes.</p> </iframe>"; texts[50] = "Iframe for Week 50"; //texts[51]-[53] removed for easier viewing Date.prototype.getWeek = function() { var onejan = new Date(this.getFullYear(),0,1); // month 0 is January return Math.ceil((((this - onejan) / 86400000) + onejan.getDay()+1)/7); } var today = new Date(); var weekno = today.getWeek(); var weektext = texts[weekno]; document.getElementById("myweek").innerHTML = weektext; } </script> </head> <body onload = "showWeekText()"> <div id = "myweek"></div> </body> </html> Hi... is there a way to create iframes using cookies and javascript ? What i need to do is to have a way to create a cookie on page one, and use the info on page two to create the iframe. Users will see a list of "external links", once they click on a link, they will be redirected to a page that will generate a iframe of the chosen link. My guess is that if there is a way, it must need to use cookies to store the info (url) to get used by the script that will create the iframe on the page that will be used to show all iframes. Any ideas or help with this will be apriciated. Sorry for my poor english. I've tried the following: Code: <script type="text/javascript" language="javascript" charset="utf-8"> // <![CDATA[ if ( top.location.href!= window.location.href ) { document.getElementById( 'bodybg' ).style.background='#12111C'; } // ]]> </script> and Code: <script type="text/javascript" language="javascript" charset="utf-8"> // <![CDATA[ if ( top.location == location ) { document.getElementById( 'bodybg' ).style.background='#12111C'; } // ]]> </script> I've tested the if statement and the set background code, using a button. I'm guessing it fails since there is no background when the script runs. Any ideas? Hi, I've created a gallery with multiple slideshows; each of them show/hide when you click on their corresponding link. The first slideshow appears when the page loads, but the others are hidden with a div style. It works great in most browsers, except Internet Explorer . For some reason, IE only shows part of the slideshows; the whole iframe is there, but only a small portion of the photos appear (although the slideshow itself also continue to run fine). I realized that the problem is the div style (style="display:none; ). When I remove it from all the slideshows, then they appear fully instead of partially in Internet Explorer. However, the purpose of hiding them is defeated, as they all show up at once when the page loads. I want to keep them all hidden until you click on their respective link to show them. The page can be viewed he www.raynemakerimages.com/galleries.html Firefox shows how it should display.... Anyway, I'm looking for a relatively easy fix for this....help is appreciated. Thanks. Coding: Code: <script type="text/javascript" language="JavaScript"> <!-- function HideContent(d) { document.getElementById(d).style.display = "none"; } function ShowContent(d) { document.getElementById(d).style.display = "block"; } function ShowContent(d) { if(document.getElementById(d).style.display == "none") { document.getElementById(d).style.display = "block"; } else { document.getElementById(d).style.display = "none"; } } //--> </script> The hide/show links: Code: <div align="center" class="class1"> <a href="javascript:ShowContent('family'), HideContent('artistic'),HideContent('intimate'),HideContent('maternity'),HideContent('newborns'),HideContent('miscellaneous')" class="style1 style32"> <span class="class1">Family </span></a> | <a href="javascript:ShowContent('artistic'), HideContent('family'),HideContent('intimate'),HideContent('maternity'),HideContent('newborns'),HideContent('miscellaneous')" class="style1 style32"> Artistic </a> | <a href="javascript:ShowContent('intimate'), HideContent('family'), HideContent('artistic'),HideContent('maternity'),HideContent('newborns'),HideContent('miscellaneous')" class="style1 style32"> Intimate </a> | <a href="javascript:ShowContent('maternity'), HideContent('family'), HideContent('artistic'),HideContent('intimate'),HideContent('newborns'),HideContent('miscellaneous')" class="style1 style32"> Maternity </a> | <a href="javascript:ShowContent('newborns'), HideContent('family'), HideContent('artistic'),HideContent('intimate'),HideContent('maternity'),HideContent('miscellaneous')" class="style1 style32">Newborns </a> | <a href="javascript:ShowContent('miscellaneous'), HideContent('family'), HideContent('artistic'),HideContent('intimate'),HideContent('maternity'),HideContent('newborns')" class="style1 style32"> Miscellaneous</a><a href="javascript:ShowContent('miscellaneous'), HideContent('family'), HideContent('artistic'),HideContent('intimate'),HideContent('maternity'),HideContent('newborns')" class="style1 style32"></a> </div> The slideshows: Quote: <table width="960" border="0" align="center" cellpadding="0" cellspacing="0" style="background-image: url(images/bg3.jpg)"> <tr> <td> <div id="family"> <p align="center"><span class="style33">Family Gallery</span><br /><iframe align="center" src="http://www.flickr.com/slideShow/index.gne?group_id=&user_id=57634260@N08&set_id=72157625563240423&tags=Family" frameBorder="0" width="700" height="700" scrolling="no"></iframe><br/></p></div> </td> </tr> <tr> <td> <div id="intimate" style="display:none;"><p align="center"><span class="style33">Intimate Gallery</span><br /><iframe align="center" src="http://www.flickr.com/slideShow/index.gne?group_id=&user_id=57634260@N08&set_id=72157625563795631&tags=Intimate" frameBorder="0" width="700" height="700" scrolling="no"></iframe><br/></p></div> </td> </tr> <tr> <td > <div id="artistic" style="display:none;"><p align="center"><span class="style33">Artistic Gallery</span><br /><iframe align="center" src="http://www.flickr.com/slideShow/index.gne?group_id=&user_id=57634260@N08&set_id=72157625563696337&tags=Artistic" frameBorder="0" width="700" height="700" scrolling="no"></iframe><br/></p></div> </td> </tr> <tr> <td> <div id="maternity" style="display:none;"><p align="center"><span class="style33">Maternity Gallery</span><br /><iframe align="center" src="http://www.flickr.com/slideShow/index.gne?group_id=&user_id=57634260@N08&set_id=72157625563996323&tags=Maternity" frameBorder="0" width="700" height="700" scrolling="no"></iframe><br/></p></div> </td> </tr> <tr> <td> <div id="newborns" style="display:none;"><p align="center"><span class="style33">Newborns Gallery</span><br /><iframe align="center" src="http://www.flickr.com/slideShow/index.gne?group_id=&user_id=57634260@N08&set_id=72157625563996817&tags=Newborns" frameBorder="0" width="700" height="700" scrolling="no"></iframe><br/></p></div> </td> </tr> <tr> <td> <div id="miscellaneous" style="display:none;"><p align="center"><span class="style33">Miscellaneous Gallery</span><br /><iframe align="center" src="http://www.flickr.com/slideShow/index.gne?group_id=&user_id=57634260@N08&set_id=72157625689475348&tags=Miscellaneous" frameBorder="0" width="700" height="700" scrolling="no"></iframe><br/></p></div> </td> </tr> </table> I've been working on a site where the content is displayed in an iframe. The iframe content is on a different domain than the iframe itself. I've already got around the cross-domain problems by creating a file on the parent domain that the iframe content references via another iframe. (which uses parent.parent to skip the permissions issue) That was all fine and pressing back and forward in the browser navigated back and forward in the iframe (at least in FF, not 100% sure about other browsers) Then the client wasn't happy that the url in the browser didn't change and pages couldn't be bookmarked. So I created a solution where the parent.parent.location.href was changed to be domain.com/#/path/to/iframecontent.php so that pages could be bookmarked, that works fine but now back and forward don't work, or more specifically the url changes correctly but the iframe content doesn't go back. Hi guys, Having a little bit of trouble with a site I'm currently working on... I'm using some AJAX for the instant g-mail/facebook style navigation, you know the kind, with no refreshes, etc. Problem is, to allow for back/forward and bookmarks, I currently use a URL that looks like: http://www.mySiteOfFun.com/index.html#page=news.html; This is fine, not a problem... The issue comes into play when I want to open up the news.html page, from my home.html page, and have it open to news item #6 (for example). I can't add a #, because one is already being used to reference the anchor for the content div. Has anyone run into a similar problem before? If so, how did you resolve it? Can some jQuery be used to find the location of the news item div in question, on load, and scroll to it like that? Just not sure how to progress really, and any help would be greatly appreciated! Hi, I am Aditya. I am explaining below the exact scenario where I need the help: I am developing a web application in which I need to integrate a javascript/html editor on some of the web pages and then provide 'Edit' buttons on those web pages so that users can edit the content on that partciular html/jsp page (like editing in wiki pages) and then, when they add some content and click on submit button, the new content should appear on the web page with all the formatting (i.e. bold, italics, color and so on) which was applied by user when he was entering the text. Now, I need help for the below issues: 1. Please suggest me a good javascript/html editor (freely downloadable) which I can use to integrate with my web pages. 2. Once the user has entered some content using the above javascript editor, how to make that content reach the server and update the corresponding web page. I am new to web development, so may be that these questions are too simple. But, I need some help from you. Waiting for your reply, Thanks, Aditya Hello, I don't know if this can be done in Javascript, or requires any other language but i was wondering if this would be possible. I would like to embed this Javascript code in to a PHP file and then for it to run automatically upon the PHP file loading: Code: <td class="smallDesc"> <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> </td> The Javascirpt is the Facebook Share button that basically allows users that have Facebook to share the page there currently on in their Facebook status by pressing the button, but if there not logged in it shows the login page, not a problem just continue the script. The current button i which is what i want to load automatically in the PHP file is located here, to test the functionalilty just click "Share" button in blue.. http://watch-movies-online.anyfilman...-Movie-17.html To summarise, i would like the above Javascript code to execute automatically upon pageload of this PHP file.. http://www.watch-movies-online.anyfi...p://google.com. If that could be done, and if this also is possible.. i would like for the "Share" button on the external page that is loaded from the Javascript code above to be clicked automatically so in effect when ever someone visits the PHP page after clicking "Click Here to Watch/Stream 2012 Online For Free" on this page it will automatically load the Facebook Share box, and automatically click the "Share" Button and then close the page if possible, but not required. Please feel free to ask any questions, i'll be happy to answer. Thanks in advance. Best Regards, Jonathan. hello guys the idea is to make "offline" bill of lading i used to do php thing and well this time i only need to kinda make bill of lading generator so i want to pass value from page 1 to page 2 and to page . all offline without web server interaction i was never fluent in javascript and i wanted to get a quick start from you guys how do i pass the form ( javascript variable from 1 page to another page ) i am googling this as well right now and hoping answer from codingforums thanks Hi, Ive written some code to try and resize a page dependant on the content oof an iframe. Code is as follows: Code: window.onload=sizeAdj(); function sizeAdj() { var elFrame = document.getElementById('theFrame'); var elTable = document.getElementById('tableGrab'); var elDivMain = document.getElementById('main'); var elDivWrapper = document.getElementById('wrapper'); var the_height = elFrame.contentWindow.document.body; elFrame.height = the_height; elTable.height = the_height + 90; elDivMain.height = the_height + 90; elDivWrapper.height = the_height + 465; } I originally thought that I would just be able to resize the iframe and the other elements would follow suit but as you can see Ive tried to resize the other encasing elements also. The code resizes partially in chrome but only to a certain point and not to the full height of the doc content. Help greatly appreciated - full source content attached. Rugby Glass.zip Thanks Sol Hi there, I need a little help with a script I am using for a link on my index page to load up a different page with two iFrames on it and at the same time load up different pages in each of these iFrames. I have achieved this with only one iFrame so far with this script: Code: 1. <script type="text/javascript"> 2. <!-- 3. 4. function loadIframe(){ 5. if (location.search.length > 0){ 6. url = unescape(location.search.substring(1)) 7. 8. window.frames["main"].location=url 9. } 10. } 11. 12. onload=loadIframe 13. //--> 14. </script> 15. 16. <a href="mainpage.html?about.htm"</a> So basically when I click on Link1 on Page1 it takes me to Page2 with iFrame1 with a page loaded and iFrame2 with nothing loaded whereas I would like Link1 on Page1 to load up Page 2 with two different pages loaded in the iFrames all at the same time. Any help would be appreciated thanks. Hi all, I have a fairly tricky problem: I have an XML feed of some products from a shop. Is there any way to make it so that if a link to 'product 1' (product_id=0001) is clicked then a div appears elsewhere on the page displaying information about that product from the XML feed (eg stock level and price of 0001). However, when a link to 'product 2' (product_id=0002) is clicked then then the information in this div is that of product 2. (ie: not opening a new div elsewhere or over the top of the old one for product 2's info, but actually in the original div, replacing product 1's info. I guess AJAX is the best method?) The reason i want to do this is so that the info displayed in the div is dependant on the link that has been clicked. I will have links to up to a few hundred products on the page so this method would keep the script size and loading times down - not to mention the enormous amount of work of manually coding a new div for each product. In fact... to make it even more complicated i actually want the links themselves (‘product 1’, ‘product 2’ etc…) to be in an iframe but the div to be opened on the parent page... perhaps its best to tackle on thing at a time though! The XML looks like: Code: <Products> <Product> <Main_Category_id>1</Main_Category_id> <Main_Category_Name>products</Main_Category_Name> <Sub_Category_1_id>12</Sub_Category_1_id> <Sub_Category_1_Name>products sub-category</Sub_Category_1_Name> <Product_id>0001</Product_id> <Product_Model>abcde</Product_Model> <Product_Name>Product 0001</Product_Name> <Product_Description> Description of product 1 </Product_Description> <Product_Price>5.00</Product_Price> <Product_Price_Special>0.00</Product_Price_Special> <Product_Currency>GBP</Product_Currency> <Product_Vat_Rate>0</Product_Vat_Rate> <Product_Image>0001</Product_Image> <Product_Image_Url> http://www.mysite.com/0001.jpg </Product_Image_Url> <Product_Quantity>9999</Product_Quantity> <Product_Weight>0.12</Product_Weight> <Product_Status>1</Product_Status> <Product_Manufacturer/> <Product_Last_Modified/> <Product_Date_Available/> </Product> <Product> <Main_Category_id>1</Main_Category_id> <Main_Category_Name>products</Main_Category_Name> <Sub_Category_1_id>12</Sub_Category_1_id> <Sub_Category_1_Name>products sub-category</Sub_Category_1_Name> <Product_id>0002</Product_id> <Product_Model>abcde</Product_Model> <Product_Name>Product 0002</Product_Name> <Product_Description> Description of product 2 </Product_Description> <Product_Price>10.00</Product_Price> <Product_Price_Special>0.00</Product_Price_Special> <Product_Currency>GBP</Product_Currency> <Product_Vat_Rate>0</Product_Vat_Rate> <Product_Image>0002</Product_Image> <Product_Image_Url> http://www.mysite.com/0002.jpg </Product_Image_Url> <Product_Quantity>9999</Product_Quantity> <Product_Weight>0.12</Product_Weight> <Product_Status>1</Product_Status> <Product_Manufacturer/> <Product_Last_Modified/> <Product_Date_Available/> </Product> Etc… </Products> Thanks for any help at all Matt I have both the java script and the php files, i just need to intergrate them into eachother to display the different topics and forums: New Forum: index.php : PHP Code: <?php include('../includes/db_connect.php'); include('../includes/inc-logincheck.php'); include('../includes/inc-functions.php'); include('../includes/inc-userfunctions.php'); include('../includes/inc-menu.php'); //include('../includes/smile.php'); $strTitle='Forum'; $strMessage=''; $intUserID=$_SESSION['uID']; $fetch=$user; ////include('../includes/forumhead.php'); $forum=$_GET['forum']; $viewtopic = $_GET['viewtopic']; if ($crew == "0"){ $query="SELECT * FROM `topics` WHERE `forum`='$forum'"; } $query=mysql_query("$query"); $num=mysql_num_rows($query); $col="0"; while($fo=mysql_fetch_object($query)){ if ($col=="0"){ $td="#444444"; $col="1"; }else{ $td="#555555"; $col="0"; } $hehe=mysql_num_rows(mysql_query("SELECT * FROM replys WHERE idto='$fo->id'")); } ?> <link rel="stylesheet" type="text/css" href="../includes/forum.css"> <td width="99%" background="../game/site/site/innerbg.gif" bgcolor="#222222" valign="top"> <br> <center> <table border="0" cellspacing="0" cellpadding="10" width="100%" class="cat"> <tr> <td> <script language='JavaScript' type='text/javascript' src='../includes/scripts/autosize.js'></script> <script> var box = 'reply'; var oldTopic = 5; var muted = 'no'; var set = 0; function parseUrl(url,variable){ var theurl = url.split('?'); if(theurl[1]){ pars = theurl[1].split('&'); for(i = 0; i < pars.length; i++){ var check = pars[i].split('='); if(check[0] == variable){ return check[1]; } } } return false; } function keepRefreshed(){ if(set == 0){ refresher = setTimeout("keepRefreshed()", 60000); allowButton = setTimeout("allowRefresh()", 3000); set = 1; } else { refreshTopics(); } } function allowRefresh(){ document.replyForm.refreshButton.disabled = false; } function refreshTopics(hl){ if(set == 1){ clearTimeout(refresher); clearTimeout(allowButton); } document.replyForm.refreshButton.disabled = true; refresher = setTimeout("keepRefreshed()", 60000); allowButton = setTimeout("allowRefresh()", 3000); if(document.replyForm.editIt.value == 'x'){ currentTopics = self.frames['topicsFrame'].location.href; var page = parseUrl(currentTopics, 'page'); var forum = parseUrl(currentTopics, 'forum'); var flag = parseUrl(currentTopics, 'flag'); if(flag){ add = '&flag=' + flag; } else { add = ''; } if(!page){ page = 1; } if(!forum){ forum = 1; } if(!hl){ hl = oldTopic; } self.frames['topicsFrame'].location.href = 'topics.php?forum=' + forum + '&default=' + oldTopic + '&page=' + page + '&hl=' + hl + add; } } function updateBox(id){ oldTopic = id; if(document.replyForm.editIt.value != 'x'){ document.replyForm.editIt.value = 'x'; document.replyForm.topicSubject.disabled = false; document.replyForm.selectedFlag.disabled = false; document.replyForm.submitTitle.value = 'Add!'; switchBox(true); } else { if(box == 'reply'){ document.replyForm.replyTo.value = id; document.replyForm.action = 'view.php?id=' + id + '&forum=' + 1; } } } function emotion(em){ document.replyForm.replyMes.value = document.replyForm.replyMes.value + em; document.replyForm.replyMes.scrollTop = document.replyForm.replyMes.scrollHeight; } function editThread(id, flag, points){ mes = self.frames['repliesFrame'].document.getElementById('topicMessage').value; sub = self.frames['repliesFrame'].document.getElementById('topicSubject').innerHTML; var replyform = document.replyForm; if(box == 'reply'){ switchBox(); } document.getElementById('topHeader').innerHTML = 'Edit thread'; replyform.topicSubject.value = sub; replyform.topicSubject.disabled = true; replyform.replyMes.value = mes; replyform.replyMes.focus(); replyform.editIt.value = id; replyform.selectedFlag.value = flag; replyform.selectedFlag.disabled = true; checkPoints(); replyform.addPoints.value = points; replyform.submitTitle.value = 'Edit!'; } function addQuote(type, username, id){ if(type == 'topic'){ quote = self.frames['repliesFrame'].document.getElementById('topicMessage'); } else { quote = self.frames['repliesFrame'].document.getElementById('quote_' + id); } format = '[quote=' + username + ']' + quote.innerHTML + '[/quote]\n\n'; document.replyForm.replyMes.value = document.replyForm.replyMes.value + format; document.replyForm.replyMes.scrollTop = 0; document.replyForm.replyMes.scrollTop = document.replyForm.replyMes.scrollHeight; } function switchBox(c,k){ if(document.replyForm.editIt.value != 'x'){ updateBox(oldTopic); return; } if((box == 'reply') && (!k)){ document.replyForm.action = 'topics.php?forum=1'; document.replyForm.target = 'topicsFrame'; document.replyForm.replyTo.value = 'x'; document.getElementById('topHeader').innerHTML = 'New topic'; document.getElementById('title').innerHTML = 'Add reply'; document.getElementById('topicTitle').style.display = 'block'; if(1 == 1){ document.getElementById('flagBox').style.display = 'block'; } box = 'topic'; } else { if(c){ document.replyForm.topicSubject.value = ''; document.replyForm.replyMes.value = ''; document.replyForm.addPoints.value = ''; document.replyForm.selectedFlag.value = 1; if(k){ url = 'topics.php?forum=1&hl=' + k; if(1 == 1){ if(document.replyForm.forumFilter.value){ url = url + '&flag=' + document.replyForm.forumFilter.value; } } self.frames['topicsFrame'].location.href = url; } } document.replyForm.action = 'view.php?id=' + oldTopic + '&forum=' + 1; document.replyForm.target = 'repliesFrame'; document.replyForm.replyTo.value = oldTopic; document.getElementById('topHeader').innerHTML = 'Add reply'; document.getElementById('title').innerHTML = 'Add topic'; document.getElementById('topicTitle').style.display = 'none'; document.getElementById('flagBox').style.display = 'none'; document.getElementById('addPoints').style.display = 'none'; box = 'reply'; } if(box == 'reply'){ updateButton(false); } else { checkPoints(); updateButton(true); } } function displayError(message){ if(message == 'clear'){ switchBox(true); document.getElementById('forumError').style.display = 'none'; document.getElementById('forumError').innerHTML = ''; } else { document.getElementById('forumError').style.display = 'block'; document.getElementById('forumError').innerHTML = message; } } var timel = 0; function countdown(){ timel -= 1; if(timel <= 0){ unMute(); } else { minutes = Math.floor(timel / 60); seconds = timel - (minutes * 60); document.getElementById('timeleft').innerHTML = '<b>Time left:</b> ' + minutes + ' minutes ' + seconds + ' seconds'; setTimeout("countdown()", 1000); } } function mutePlayer(muter, reason, post, timeleft){ muted = 'yes'; timel = timeleft; minutes = Math.floor(timeleft / 60); seconds = timeleft - (minutes * 60); document.getElementById('muteBox').innerHTML = 'You are unable to post because you have been muted by: <a href="viewprofile.php?viewuser=' + muter + '">' + muter + '</a><br><br><b>Reason:</b> ' + reason + '<br><div id="timeleft"><b>Time left:</b> ' + minutes + ' minutes ' + seconds + ' seconds</div><b>Post:</b><br>' + post; document.getElementById('replyBox').style.display = 'none'; document.getElementById('muteBox').style.display = 'block'; setTimeout("countdown()", 1000); } function unMute(){ muted = 'no'; document.getElementById('replyBox').style.display = 'block'; document.getElementById('muteBox').style.display = 'none'; } function checkPoints(){ var flag = document.replyForm.selectedFlag; if(flag.value == 13){ document.getElementById('addPoints').style.display = 'block'; } else { document.getElementById('addPoints').style.display = 'none'; } if(flag.value <= 3){ updateButton(true); } else { updateButton(false); } } function updateButton(upto){ if(1 == 1){ var button = document.replyForm.submitTitle; var flag = document.replyForm.selectedFlag; if((upto) && (flag.value <= 3)){ button.disabled = true; } else { button.disabled = false; } } } function updateFilter(){ var flag = document.replyForm.forumFilter.value; if(flag != 'void'){ url = 'topics.php?forum=1'; if(flag != 'all'){ url += '&flag=' + flag; } self.frames['topicsFrame'].location.href = url; } } function watchThread(){ url = 'topics.php?forum=1&hl=' + oldTopic + '&watch=' + oldTopic; if(document.replyForm.forumFilter.value){ url = url + '&flag=' + document.replyForm.forumFilter.value; } self.frames['topicsFrame'].location.href = url; } </script> <div id="forumError" display="none"></div> <center> <table border=0 cellspacing=0 cellpadding=2 width=99% bordercolor=black> <tr> <td width=40% valign=top class="insideTables"> <form name="replyForm" method="post" target="repliesFrame" action="view.php?id=5&forum=1"> <table border=1 cellspacing=0 cellpadding=2 width=100% class=sub2 bordercolor=black> <tr> <td align=center class=header><div id="topHeader">Add reply</div></td> </tr> <tr> <td> <div id="replyBox"> <div style="display:none;" id="topicTitle">Subject: <input type=text style="width:100%" name="topicSubject" maxlength=35><br>Message:<br></div> <textarea style="width:100%" rows=5 name="replyMes" style="white-space: normal;"></textarea> <div style="display:none;" id="flagBox"> <select style="width:100%;" name="selectedFlag" onChange="javascript:checkPoints()"><option selected value="1" style="background-color:#CDCDCD;">--- GAME RELATED ---</option> <option value="4" style="background-color:#69A16C;">Questions/Help</option> <option value="5" style="background-color:#69A16C;">Feature Discussion</option> <option value="6" style="background-color:#69A16C;">RIP/WS</option> <option value="7" style="background-color:#69A16C;">Bust Party</option> <option value="8" style="background-color:#69A16C;">Promotions</option> <option value="22" style="background-color:#69A16C;">Other</option> <option value="2" style="background-color:#CDCDCD;">--- OFF TOPIC ---</option> <option value="9" style="background-color:#CCAB6B;">Contests & Games</option> <option value="10" style="background-color:#CCAB6B;">Bars</option> <option value="11" style="background-color:#CCAB6B;">Rate THIS</option> <option value="21" style="background-color:#CCAB6B;">Sports</option> <option value="23" style="background-color:#CCAB6B;">Movies, Music & TV</option> <option value="24" style="background-color:#CCAB6B;">Other</option> <option value="3" style="background-color:#CDCDCD;">--- CLASSIFIEDS ---</option> <option value="13" style="background-color:#6B9FCC;">Points</option> <option value="14" style="background-color:#6B9FCC;">Crew</option> <option value="15" style="background-color:#6B9FCC;">Pictures & Music</option> <option value="16" style="background-color:#6B9FCC;">Casino</option> <option value="17" style="background-color:#6B9FCC;">Protection</option> <option value="18" style="background-color:#6B9FCC;">Organized Crime</option> <option value="19" style="background-color:#6B9FCC;">Establishment</option> <option value="20" style="background-color:#6B9FCC;">Other</option> </select> </div> <div style="display:none;" id="addPoints"> Verify: <input type=text name="addPoints" size=5> </div> <br> <input type=hidden name="replyTo"> <input type=hidden name="editIt" value="x"> <center> <a onclick="emotion(' :arrow: ')" style="cursor: pointer;"><img src="../game/emotions/arrow.gif" border=0 alt=":arrow:"></a> <a onclick="emotion(' :D ')" style="cursor: pointer;"><img src="../game/emotions/biggrin.gif" border=0 alt=":D"></a> <a onclick="emotion(' :S ')" style="cursor: pointer;"><img src="../game/emotions/confused.gif" border=0 alt=":S"></a> <a onclick="emotion(' 8) ')" style="cursor: pointer;"><img src="../game/emotions/cool.gif" border=0 alt="8)"></a> <a onclick="emotion(' :\'( ')" style="cursor: pointer;"><img src="../game/emotions/cry.gif" border=0 alt=":'("></a> <a onclick="emotion(' 8| ')" style="cursor: pointer;"><img src="../game/emotions/eek.gif" border=0 alt="8|"></a> <a onclick="emotion(' :evil: ')" style="cursor: pointer;"><img src="../game/emotions/evil.gif" border=0 alt=":evil:"></a> <a onclick="emotion(' :!: ')" style="cursor: pointer;"><img src="../game/emotions/exclaim.gif" border=0 alt=":!:"></a> <a onclick="emotion(' :idea: ')" style="cursor: pointer;"><img src="../game/emotions/idea.gif" border=0 alt=":idea:"></a> <a onclick="emotion(' :lol: ')" style="cursor: pointer;"><img src="../game/emotions/lol.gif" border=0 alt=":lol:"></a> <a onclick="emotion(' :mad: ')" style="cursor: pointer;"><img src="../game/emotions/mad.gif" border=0 alt=":mad:"></a> <br> <a onclick="emotion(' :?: ')" style="cursor: pointer;"><img src="../game/emotions/question.gif" border=0 alt=":?:"></a> <a onclick="emotion(' :redface: ')" style="cursor: pointer;"><img src="../game/emotions/redface.gif" border=0 alt=":redface:"></a> <a onclick="emotion(' :rolleyes: ')" style="cursor: pointer;"><img src="../game/emotions/rolleyes.gif" border=0 alt=":rolleyes:"></a> <a onclick="emotion(' :( ')" style="cursor: pointer;"><img src="../game/emotions/sad.gif" border=0 alt=":("></a> <a onclick="emotion(' :) ')" style="cursor: pointer;"><img src="../game/emotions/smile.gif" border=0 alt=":)"></a> <a onclick="emotion(' :o ')" style="cursor: pointer;"><img src="../game/emotions/surprised.gif" border=0 alt=":o"></a> <a onclick="emotion(' :P ')" style="cursor: pointer;"><img src="../game/emotions/toungue.gif" border=0 alt=":P"></a> <a onclick="emotion(' :twisted: ')" style="cursor: pointer;"><img src="../game/emotions/twisted.gif" border=0 alt=":twisted:"></a> <a onclick="emotion(' ;) ')" style="cursor: pointer;"><img src="../game/emotions/wink.gif" border=0 alt=";)"></a> <a onclick="emotion(' :tdn: ')" style="cursor: pointer;"><img src="../game/emotions/tdown.gif" border=0 alt=":tdn:"></a> <a onclick="emotion(' :tup: ')" style="cursor: pointer;"><img src="../game/emotions/tup.gif" border=0 alt=":tup:"></a> <br> <input type=submit value="Add!" name="submitTitle"> <input type=button value="Watch!" onClick="javascript:watchThread()"> <input type=button value="Refresh!" name="refreshButton" onClick="javascript:refreshTopics()"> </center> </div> <div id="muteBox" style="display:none;"></div> </td> </tr> <tr> <td align=center class=header>Topics (<a href="javascript:switchBox()" id="title">Add topic</a>)</td> </tr> <tr> <td> <select style="width:100%;" onChange="javascript:updateFilter()" name="forumFilter"> <option value="void" style="background-color:#CDCDCD;"> FILTER</option> <option value="all">View all</option> <option selected value="1" style="background-color:#CDCDCD;">--- GAME RELATED ---</option> <option value="4" style="background-color:#69A16C;">Questions/Help</option> <option value="5" style="background-color:#69A16C;">Feature Discussion</option> <option value="6" style="background-color:#69A16C;">RIP/WS</option> <option value="7" style="background-color:#69A16C;">Bust Party</option> <option value="8" style="background-color:#69A16C;">Promotions</option> <option value="22" style="background-color:#69A16C;">Other</option> <option value="2" style="background-color:#CDCDCD;">--- OFF TOPIC ---</option> <option value="9" style="background-color:#CCAB6B;">Contests & Games</option> <option value="10" style="background-color:#CCAB6B;">Bars</option> <option value="11" style="background-color:#CCAB6B;">Rate THIS</option> <option value="21" style="background-color:#CCAB6B;">Sports</option> <option value="23" style="background-color:#CCAB6B;">Movies, Music & TV</option> <option value="24" style="background-color:#CCAB6B;">Other</option> <option value="3" style="background-color:#CDCDCD;">--- CLASSIFIEDS ---</option> <option value="13" style="background-color:#6B9FCC;">Points</option> <option value="14" style="background-color:#6B9FCC;">Crew</option> <option value="15" style="background-color:#6B9FCC;">Pictures & Music</option> <option value="16" style="background-color:#6B9FCC;">Casino</option> <option value="17" style="background-color:#6B9FCC;">Protection</option> <option value="18" style="background-color:#6B9FCC;">Organized Crime</option> <option value="19" style="background-color:#6B9FCC;">Establishment</option> <option value="20" style="background-color:#6B9FCC;">Other</option> </select> </td> </tr> <tr> <td> <iframe width=100% height="357" src="topics.php?forum=1&flag=<?php echo "$forum"; ?>" frameborder="0" allowTransparency="true" name="topicsFrame" id="topicsFrame"></iframe> </td> </tr> </table> </form> </td> <td width=60% valign=top> <iframe width=100% height="590" src="view.php?forum=1&id=<?php echo "$viewtopic"; ?>" frameborder="0" id="repliesFrame" name="repliesFrame" allowTransparency="true"></iframe> </td> </tr> </table> </td> </tr> </table> </td> <?php include("/home/tacticsc/domains/360-tactics.co.uk/public_html/crimewave/includes/inc-footer.php"); ?> i will post the rest of the codes in comments below due to too many word count. if its not to hard please help me, i have put all the Javascript there and the php it just needs to be implimented, i have started some of it, such as getting the topics to display like so: its just when you click the topic it doesnt load into the right hand iframe and some other things like the reply box ect thanks. Dan Hey everyone! I used to use iframes to load external content without resetting the parent page. After reading the disadvantage of iframes, I've been looking for alternatives. I Googled and found different solutions, however with a problem: what I found are all scripts that require Java, meaning my design would be rendered useless in a java-disabled browser. So is there a safe method I can use, one allowing me to have navigation tabs on a single page that loads content into a div/or any kind of alternative to an iframe (without resetting the page) ? Thanks in advance. Nat i have a archive of data that i want to be loaded in iframes since i have reached a length limit within that page. so what i have is a script that put in a value into a text area, but now i am trying to convert it to putting an src value inside an i frame. i am not the best with javascript so any help would be great. Code: <script type="text/javascript"> function ddl_changed(obj) { var pr = prim.options[prim.selectedIndex].value; var s1 = document.getElementById('s1'); s1.src = pr; } </script> body <div class="prim" align="center"> Database <select id="prim" onchange="ddl_changed(this)"> <option value=" ">Choose a data set</option> <option value="/ds2">data set 1</option> <option value="/ds3">data set 2</option> </select> </div> <iframe name="s1" id="s1" src=" "><p id="noframe">Your browser does not support frames</p> </iframe> thanks Hi, I'm trying to build this grease monkey script, which runs on all pages, and simply deletes all iframes that have no content loaded in them. I have a hosts file with many ad servers which are blocked. This leaves ugly holes in the page and I am trying to remove these empty iframes. Plz help I apologise if this is in the wrong section. I have built a website using iframes at: http://www.krillmeed.com/ but when clicking through the menu, the address bar still stays at http://www.krillmeed.com/ no matter which page is loaded into the iframe. I have seen a number of javascripts around that can change this, but most do not seem to work anymore. Has anyone a sure way to correct this please
|