JavaScript - Alternative To Iframes Without Java?
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 Similar TutorialsHi, Is there any alternative to the ' body onload="" ' function? I have on the page several scripts running and one is blocking the others because of the body onload function. It is working if I change that to body onfocus but it is loading the content all over when the user gets back to the page. Any ideas how can I avoid this? I can't apply onload to some element, onfocus is not working and this code also does not suite me: Code: <script type="text/javascript> function(); </script> Thanks in any case! Batric is there any alternative to document.write() which writes only in a specific part of document, does not overwrite whole document. and yeah, in this case the document.getElementById().innerHTML dosent work either, coz its in a loop, here's the code if you wanna see: Code: if (aa==1) { for (i=0;i<a.length;i++) { c = txt; b = a[i].childNodes[0].nodeValue; // a is already assigned someplace in a xml document. txt = (b==" T4 ")? "T4 <br />": ""; document.write(c); } } Note: in the above code, the code: Code: txt = (b==" T4 ")? "T4 <br />": ""; is same as (also can be written as ) the code : Code: if (b==" T4 ") { txt = "T4 <br />" ; } else { txt = "" ; } I have this code http://www.jsfiddle.net/Nntc7/ created by a pdf publisher, I need to offer non flash content to users but dont know javascript and I cant get the thing to work using swfobject, How do I edit this to allow for alternative content?? thanks in advance I am very new to JavaScript, however I already seem semi-stumped. The tutorial I am using, mentions that for tutorial example purposes they use document.write() however it suggests that I avoid using this as it will overwrite the whole HTML page. I know that I can use document.getElementById() for some things... however this begs my question: When do you use document.write(), when do you use document.getElementById() and is there also another method you use to change/write to the HTML Document using JavaScript? Otherwise, do you just use document.getElementById() quite a lot in JavaScript? Like I said, I'm very new to JavaScript, so it's all still very new to me. Cheers, Asher Issue: I have a java script that bring up a simple password box, It works great in Chrome, Safari, firefox but I get a box in Internet explorer asking my customers to take another step to allow access. This is not good, Customers did not now what to do. Error: This website is using a scripted window to ask you for information. If you trust this website, click here to allow scripted windows Microsoft response: "Internet Explorer has blocked a website from using a small program (called a script) to display a separate window. Hackers sometimes use scripted windows to mimic legitimate windows, such as login screens, that appear on websites. If you trust the website and want to allow the scripted window, click the Information Bar, and then click Temporarily Allow Scripted Windows. To always allow scripted windows, check the Allow websites to prompt for information using scripted windows custom security setting." Objective: I now there is likely no way to by pass this, so i need a different solution. Possible a Form Box to be present on the site that when information is entered it passes the password to the javascript code to allow access? Please help, this is actually urgent as I have already lost a customer :-( Code: : <script> function getStyle() { var temp = document.getElementById("admintable").style.visibility; return temp; } function switchMain() { var isAuthed = authenticate(); if(isAuthed){ var current = getStyle(); if( current == "visible" ){ document.getElementById("admintable").style.visibility = "hidden"; }else{ document.getElementById("admintable").style.visibility = "visible"; } } } function authenticate() { if(readCookie('authenticated')!=null) { return true; } else{ var password=prompt("Enter Code","") if (password =="1234") { createCookie('authenticated',true); return true; } } return false; } function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); } return null; } function createCookie(name,value,days) { if (days) { var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); var expires = "; expires="+date.toGMTString(); } else var expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } </script> Here is what I found online: http://www.anyexample.com/webdev/jav...lternative.xml UPDATE: I am a n00b, I need to incorporate this code below to the one above. Thanx Philip Code: <input type = "password" name = "pwd" id = "pwd" onchange = checkPassword(this.value)" <script type = "text/javascript"> function checkPassword(which) { if (which != "1234") { // password is visible!!! alert ("Incorrect password - please try again"); document.getElementById("pwd").value =""; return false; } else { alert ("Password is correct!"); //do more stuff here, e.g create the cookie } } </script> The site i am building uses a large content slider as its main navigation. There is an absolutely positioned header on the page, and the slider sits underneath. This all works perfectly once i am linking (to named anchors) within the same page However when an external pages links to one of the anchors, the top of the slider content is hidden underneath the header - the user need to scroll down to get the content to start below the header. Long story short, I have used the following to force the browser to scroll to the top of the page when it loads: <script type="text/javascript"> window.onload = function(){ window.scrollTo(0,0); } </script> This doesnt load until everything else on the page has loaded though, is there a way to force the browser to scroll to the top BEFORE everything else loads? Or better yet not to scroll at all but to make sure the window is positioned at (0,0) automatically when it loads? Also, this doesnt seem to be working at all in IE Thanks in advance! I need to detect the "name" of the constructor of an object. For example, myArray.constructor === Array is true, but I want something where that === 'Array' is true. I've heard of Object.constructor.name, but it's not widely compatible. Any ideas (preferably without involving regular expressions)? Thanks in advnce, Julian Hey guys. So right now I'm able to execute javascript code on my website without the use of <script> tags. Example: <body onload=alert("cool");></body> What I want to be able to do is insert an external javascript file located at another website using JavaScript code (not script tags). How can this be done? Thanks Hi There, I'm developing a simple web application (they are a "choose the right answer" type of exercise) using JavaScript to deal with the data and logic behind this application. These applications require pressing a button to answer some proposed questions. My question is: Is there a way, using JavaScript, to create some accesKeys without having to press ALT+key (IE) or CTRL+ALT+key (mozilla firefox)? Thanks in Advance! I'm working on code for my forums that will allow users to post text which can be moused over to display an image that will follow the cursor (provided the cursor is hovering above the specific text). The code works, but it obviously can't be used for more than one picture per page because getElementById finds the first div and always displays it onmouseover of any attempted mouseover text. The Javascript in <head> is Code: <script type="text/javascript"> // Pop up code begin function ShowPopup(hoveritem) { hp = document.getElementById("hoverpopup"); // Set popup to visible hp.style.visibility = "Visible"; } function HidePopup() { hp = document.getElementById("hoverpopup"); hp.style.visibility = "Hidden"; } // Follow mouse script begin var divName = 'hoverpopup'; // div that is to follow the mouse // (must be position:absolute) var offX = 5; // X offset from mouse position var offY = 5; // Y offset from mouse position function mouseX(evt) {if (!evt) evt = window.event; if (evt.pageX) return evt.pageX; else if (evt.clientX)return evt.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft); else return 0;} function mouseY(evt) {if (!evt) evt = window.event; if (evt.pageY) return evt.pageY; else if (evt.clientY)return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop); else return 0;} function follow(evt) {if (document.getElementById) {var obj = document.getElementById(divName).style; obj.left = (parseInt(mouseX(evt))+offX) + 'px'; obj.top = (parseInt(mouseY(evt))+offY) + 'px';}} document.onmousemove = follow; </script> So the display code is Code: <a id="hoverover" style="cursor:default;" onMouseOver="ShowPopup(this);" onMouseOut="HidePopup();">text here</a> <div id="hoverpopup" style="visibility:hidden; position:absolute;"><img src="url here"></div> I just want to be able to have more than one instance on each page and still be able to declare the image url in the body and not within the javascript. After much research i understand that Safari isn't able to call the onClick Event like the other browsers do. So how do i get Safari to act like the other browsers is my question? I have see no real alternative. Can any of you help? My current code is below. It works in all browsers except Safari (haven't checked Chrome, but it should be same as Safari what i read). Thanks much. Code: <script language="Javascript"> <!-- $(document).ready(function() { $('.create_project').click(function(){ alert('its working'); }); }); //--> </script> Code: a href="javascript:void(0);" class="create_project"><img src="b.create.off.gif" width="99" height="45" border="0" id="Image51" onMouseOver="MM_swapImage('Image51','','b.create.on.gif',1)" onMouseOut="MM_swapImgRestore()"> 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! I want the result of a fileld to appear bellow the form and not in a new blank page (witch happens when you have document.write?). I guess it has something to do with "innerHTML"? Can anyone of you help me to make the result of this IF to appear bellow the form? if (document.Form.TypedInField.value == "The Cable Guy") { document.write("You just wrote a title of a nice movie") } I have the form and everything works perfect, except of that the result of what the user have wrote (beacuse of docuemnt.write) land in blank window. I would be very happy of any of you could solve this for me I've been trying to get a form to control iframes, but new to javascript I basically want to input the url from a form & display it in an iframe, but cant figure out how to link the url from the form to the iframe The code im using atm Code: <html> <head> <title> SearchLite v2 - search multiple sites at once</title> <STYLE TYPE="text/css"> .txt { BACKGROUND-COLOR: lavender; BORDER-BOTTOM-COLOR: lavender; BORDER-BOTTOM-WIDTH: 0px; BORDER-LEFT-COLOR: lavender; BORDER-LEFT-WIDTH: 0px; BORDER-RIGHT-COLOR: lavender; BORDER-RIGHT-WIDTH: 0px; BORDER-TOP-COLOR: lavender; BORDER-TOP-WIDTH: 0px; HEIGHT: 22px; WIDTH: 599px; } .cellht { HEIGHT: 50px; } .cell { BACKGROUND-COLOR: lavender; } </STYLE> <script> function win() { frmlen = document.myform.elements.length; idiv=1; for (var icnt=0;icnt<frmlen;icnt++) { //loop thru all FORM elements and look for checkboxes which have been checked if (document.myform.elements[icnt].type=="checkbox" && document.myform.elements[icnt].checked) { //make IFRAME visible document.getElementById("f"+idiv).style.visibility = 'visible'; //make textbox that shows heading with name of site being searched, visible document.getElementById("t"+idiv).style.visibility = 'visible'; //build the URL strSite = document.myform.elements[icnt].value; strSearch= escape(document.myform.mytext.value); url = strSite + strSearch; //set SRC property of IFRAME to dynamically built URL document.getElementById("f"+idiv).src = url; //show only the domain name part of the URL dmn=url.substring(7); document.getElementById("t"+idiv).value= dmn.substring(0,dmn.indexOf("/")); idiv+=1; } } } function hide() { for (var icnt=1;icnt<13;icnt++) { //hide all IFRAME s document.getElementById("f"+icnt).style.visibility = 'hidden'; //hide all the camouflaged textboxes that display the title document.getElementById("t"+icnt).style.visibility = 'hidden'; } } </script> </head> //Form1 i want to use for the url ........... <form> Enter URL1: <input type="text" name="Enter Url" /> </form> //Form2 i want to use for the url ........... <form> Enter URL2: <input type="text" name="Enter Url" /> </form> <body onload="hide()"> <form method=post action="" name="myform"> <table border=0 align='center'> <tr><td colspan=3 height='30%'><font size="5">SEARCH</font><i><font size="5" color="blue">LITE</font></i> v2 -search multiple sites at once and view results on a single page </td><td colspan=2> </td></tr> <tr > <td COLSPAN=3 ><input type="text" name="mytext" size="55"></td> <td COLSPAN=3><input type="button" value="Find" onClick="win()"> <input type="reset" value="Reset" onclick="hide()"> <a href="mailto:dotnut@hotmail.com">Feedback</a></td> </tr> <tr > //Want to change the value= replaced by the value in the form <td class="cell"><input type="checkbox" name="1" value="http://www.google.com/search?hl=en&btnG=Google+Search&q=">Google</td> <td class="cell"><input type="checkbox" name="2" value="http://www.dictionary.com/search?q=">Dictionary</td> <tr><td COLSPAN=5 HEIGHT='50' CLASS='cellht'><input type='text' id='t1' class='txt'></td></tr> <tr><td COLSPAN=5><IFRAME id='f1' FRAMEBORDER=1 SCROLLING='yes' WIDTH=600 HEIGHT=360></IFRAME><br></td></tr> <tr><td COLSPAN=5 CLASS='cellht'><input type='text' id='t2' class='txt' ></td></tr> <tr><td COLSPAN=5><IFRAME id='f2' FRAMEBORDER=1 SCROLLING='yes' WIDTH=600 HEIGHT=360></IFRAME><br></td></tr> </table> </form> </body> </html> thnx 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 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 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
Hi everyone, I run a streaming site and am looking to have the option on a chat room next to the stream. Not everyone likes having the chat facility so I'd like to make it optional. As the page loads I'd like the content to look like the diagram below with the stream (iframe1) taking up 95% of the page and the other 5% being taken up by an image which will say "open chat". The chat (iframe2) would have a width of 0%. Then when the "open chat" image is clicked I'd like the chat (iframe2) to become 35% and the stream (iframe1) to become 60%. If someone could make a nice sliding effect when the image is clicked that'd be even better. Here's a diagram to show what it'd look like with the resized iframes. If anyone can help me out and get this working to a good standard there will be a small paypal gift on offer . Cheers, Ben 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 |