JavaScript - Javascript Loading Outside Of Frames
Hi, im having a problem adding a frame busting killer that counteracts a frame killer script on sites so i can load them inside my iframes..
here is the code i use <?php $result = mysql_query("SELECT ru.id, ru.username, ru.owid FROM raidbar_users ru LEFT JOIN raidbar_groups rg ON ru.groupid = rg.id WHERE rg.id = '".(int)$_REQUEST['group']."'") or die(mysql_error()); $myRaidid = raidid(); if(isset($_GET['gm'])) { echo '<FRAMESET rows="*,*,*,30" frameborder="0">' . "\n"; echo ' <FRAMESET cols="*,*" frameborder="0" scrolling="no">' . "\n"; $i = 0; while($row = mysql_fetch_array($result)) { if ($i == 2) { echo ' </FRAMESET>' . "\n"; echo ' <FRAMESET cols="*,*" frameborder="0" scrolling="no">' . "\n"; $i = 0; } echo ' <FRAME src="http://'.$server[$siteConfig['userServer']].'.***********/joinraid.php?raidid=' . $myRaidid . '&suid=' . $row['owid'] . '&serverid='.$siteConfig['userServer'].'">' . "\n"; $i++; } echo ' <FRAME src="">' . "\n"; echo ' </FRAMESET>' . "\n"; echo ' <FRAMESET frameborder="0" scrolling="no">' . "\n"; echo ' <FRAME src="http://'.$server[$siteConfig['userServer']].'.***********/raidmembers.php?raidid=' . $myRaidid . '">' . "\n"; echo ' </FRAMESET>' . "\n"; echo '</FRAMESET>' . "\n"; } else { echo '<table cellspacing=1 cellpadding=1>' . "\n"; echo '<tr>' . "\n"; $i = 0; while($row = mysql_fetch_array($result)) { if ($i == 2) { echo '</tr>' . "\n"; echo '<tr>' . "\n"; $i = 0; } echo ' <td><iframe src="./acct.php?suid=' . $row['owid'] . '" width=450 height=225 scrolling=no frameborder=0></iframe>' . "\n"; $i++; } echo '</tr>' . "\n"; echo '<tr>' . "\n"; echo ' <td><iframe src=http://'.$server[$siteConfig['userServer']].'.***********/raidmembers.php?raidid=' . raidid() . '&serverid='.$siteConfig['userServer'].' width=250 height=30 scrolling=no></iframe>' . "\n"; echo '</tr>' . "\n"; echo '</table>' . "\n"; } ?> Now im told to use the following.. <script type="text/javascript"> var prevent_bust = 0 window.onbeforeunload = function() { prevent_bust++ } setInterval(function() { if (prevent_bust > 0) { prevent_bust -= 2 window.top.location = 'http://server-which-responds-with-204.com' } }, 1) </script> or var prevent_bust = 0; // Event handler to catch execution of the busting script. window.onbeforeunload = function() { prevent_bust++ }; // Continuously monitor whether busting script has fired. setInterval(function() { if (prevent_bust > 0) { // Yes: it has fired. prevent_bust -= 2; // Avoid further action. // Get a 'No Content' status which keeps us on the same page. window.top.location = 'http://server-which-responds-with-204.com'; } }, 1); But the window.top.location i dont know how to incorporate that to work. Can anyone help? Similar TutorialsHi, I will appreciate if someone could help me with this Case Problem. For some reason that I don't understand, it seems to be working in Firefox, but not IE. Well, most of it is working. The problem is to create a "Demo" which has three frames in rows. The first frame at the top is the title bar with "Submit Code", "show only code", "show only preview", and "show code and preview" buttons. The middle frame has 2 textarea boxes. The html code goes in the left box, and the css styles go in the right box. Once you enter any code in their respected boxes, and press "submit code", it should be rendered as a web page in the third frame below the boxes (which is just an empty document). I have attached a screenshot of how it should look like, and I am posting my entire code below. Everything is working except for the rendering of the web page in the third frame. When I click on submit, I get no errors, nothing happens. Any help or suggestions would be greatly appreciated. Thank you. Code: function showPreview(){ parent.document.getElementById("demo").rows="100,1,*"; } function showCode(){ parent.document.getElementById("demo").rows="100,*,1"; parent.frames[1].document.getElementById("inputhtml").style.height="300px"; parent.frames[2].document.getElementById("inputcss").style.height="300px"; } function showBoth(){ parent.document.getElementById("demo").rows="100,210,*"; parent.frames[1].document.getElementById("inputhtml").style.height="150px"; parent.frames[2].document.getElementById("inputcss").style.height="150px"; } function sendCode(){ var previewFrame=parent.frames[3]; var htmlCode=parent.frames[1].document.getElementById("inputhtml").value; var cssCode=parent.frames[2].document.getElementById("inputcss").value; previewFrame.document.write("<html><head><title></title>"); previewFrame.document.write("<style type='text/css'>"+cssCode+"</styles>"); previewFrame.document.write("</head>"); previewFrame.document.write("<body>"+htmlCode+"</body></html>"); //previewFrame.document.close(); } </script> </head> <body> <form name="control" id="control" action=""> <h2 id="demotitle">Creating Web Pages</h2> <p> <input type="button" value="Submit Code" onClick="sendCode()"/> <input type="button" value="Show Only Code" onClick="showCode()" /> <input type="button" value="Show Only Preview" onClick="showPreview()"/> <input type="button" value="Show Code and Preview" onClick="showBoth()"/> </p> </form> </body> </html> What's Up? OK, So I've been trying to add text to a <textarea> and text field tag inside of a frame via JavaScript, I did find a tutorial and using off-line html's it worked, But when I try to use a online frame, It doesn't work. OK, So one html opens two frames which are. Left.html Code: <HTML> <HEAD> <TITLE>JavaScript Example 13</TITLE> </HEAD> <BODY> <INPUT type="button" value="Button" onClick=""> </FORM> </BODY> </HTML> right.html Code: <form action="posting.php" method="post" name="post" onsubmit="return checkForm(this)"> <table width="100%" cellspacing="2" cellpadding="2" border="0"> <input class="post" type="text" value="" tabindex="2" style="width: 450px;" maxlength="60" size="45" name="subject"/> <textarea onkeyup="storeCaret(this);" onclick="storeCaret(this);" onselect="storeCaret(this);" class="post" tabindex="3" style="width: 450px;" cols="35" rows="15" name="message"/></textarea> <input type="submit" value="Submit" class="mainoption" name="post" tabindex="6" accesskey="s"/> Anyone Know What To Do? Thanks Bye. hi Folks, I am new for HTML FRAMES. I have the code like as shown below. Code: <FRAMESET rows="0,*" FRAMEBORDER=0 FRAMESPACING=0 BORDER=0> <FRAME SRC="Javascript:parent.getStartupScreen ()" name="RP" scrolling="no" > <FRAMESET rows="0,*,0,8%" FRAMEBORDER=0 FRAMESPACING=0 BORDER=0> <FRAME SRC="/jsp/hierarchy/control.jsp" name="cF" scrolling="NO"> <FRAME SRC="Javascript:parent.getBlank()" name="vF" scrolling="AUTO"> <FRAME SRC="Javascript:parent.getBlank()" name="dF" scrolling="NO"> <FRAME SRC="/jsp/resourceplanner/ResourcePlannerFooter.jsp" name="RPF" scrolling="NO"> </FRAMESET> </FRAMESET> i am currently on "RPF" Frame. I want to refer "RP" Frame loaded "Form" Elements . Please suggest me . Thanks... New assignment. This is the code i have below already supplied now. not exactly correct yet but want to just get something to work from i need to insert an embedded script element in head section of document, purpose os to hide htmlcode and csscode frames to provide more screen space to hide 2 frames i am to change value of rows attribute in demo frameset to "100,1,*" id of the frameset object is demo Code: <title>Web Design Demo Control Buttons</title> <link href="title.css" rel="stylesheet" type="text/css" /> <script src="demo.htm" type="text/javascript"></script> <script type="text/javascript"> function showPreview(id,x,y) { object=document.getElementById(id); object.style.visibility="hidden"; top.FrameName.rows = "100,1,*"; } </script> just for your reference here is the demo part Code: <html> <head> <!-- New Perspectives on JavaScript Tutorial 6 Case Problem 3 Web Design Demo Filename: demo.htm Supporting files: css.htm, html.htm, title.htm --> <title>HTML Demo</title> </head> <frameset rows="100,210,*" id="demo" name="demo"> <frame name="title" id="title" src="title.htm" scrolling="no" /> <frameset cols="*,*"> <frame name="code1" id="code1" src="html.htm" /> <frame name="code2" id="code2" src="css.htm" /> </frameset> <frame name="output" id="output" /> </frameset> </html> how does this look so far just remember the top code is what i am working on what should i change and add? suggestions anyone? Hi, well i searched at google and was not exactly able to find what i was looking for, i am looking for a script the shows by logo while loading the game at back end, shows loading percentage or bar representing how game is loaded and then makes the my logo disappear once the game is loaded e-g like this site has used http://www.gamegape.com/en-2095-elemental-battles.html if some thing like this is not available can someone atleast tell me how this site has done it, so we could copy it from them ^_^ I know this was here previously but no solution was found and I wonder if someone could help. JavaScript loads before even DOM is fully loaded but only in Chrome browser. I know I could use setTimeout function but it's now ideal in my case. I am working on a program based on Chromium and have a html page inside it. Page has 4 images that resize (useing javascript) depending on window size Here is load finction Code: window.onload = function(){ window.document.body.onload = initDocument; }; function initDocument() { stretchFit("divMy", "bg"); stretchFit("divG", "bgG"); stretchFit("divTech", "bgTech"); stretchFit("divKB", "bgKB"); } Any ideas how to load function after DOM is loaded? Hi guys, I am new here and am looking for a bit of help! I am building a website for a friend and am using Javascript. When I preview the site from my computer in Chrome/Firefox then all the JS elements render correctly. I am using jCarouselLite by the way and have used HTML Boilerplate too. However, when I upload the site the Carousel does not work... Also, I seem to have a lot of scripts kicking around inside the html so I will give you a list of those, but here are my external JS files so my question before posting up all the code are 1.) what is the problem with rendering the JS elements live on t'internet, and 2.) can I reduce the amount of JS files/scripts to help page loading times? css_browser_select.js modernizr-1.7.min.js jquery-1.6.1.min.js jcarousellite.js functions.js Code: $(document).ready(function(){ // Activate the main slider $("#mainSlider").jcarousellite({ btnNext: "#sliderBtnNext", btnPrev: "#sliderBtnPrev", visible: 1 }); }); plugins.js script.js jquery.placeholder.min.js and this is the code inside my HTML: Head: Code: <!-- CSS: implied media="all" --> <link rel="stylesheet" href="css/style.css" media="screen"> <link rel="stylesheet" media="handheld" href="css/handheld.css"> <!-- CSS Browser Compatibility --> <script src="js/css_browser_select.js"></script> <!-- Mobile viewport optimized: j.mp/bplateviewport --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects --> <script src="js/libs/modernizr-1.7.min.js"></script> /Head and this is at the bottom of the Body: Code: <script src="js/libs/jquery-1.6.1.min.js"></script> <script src="js/libs/jcarousellite.js"></script> <script src="js/libs/functions.js"></script> <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> <script>window.jQuery || document.write("<script src='js/libs/jquery-1.6.1.min.js'>\x3C/script>")</script> <!-- scripts concatenated and minified via ant build script--> <script src="js/plugins.js"></script> <script src="js/script.js"></script> <!-- THIS MAY NEED TO BE REDONE! Placeholder for Forms --> <script src="js/libs/jquery.placeholder.min.js"></script> <script> if (!Modernizr.input.placeholder){ $('input[placeholder], textarea[placeholder]').placeholder(); } </script> <!-- Form Submit --> <script> function submitForm() { document.contactPhone.submit(); } </script> <!-- Google Analytics Script - Change UA-XXXXX-X to be your site's ID --> <script> var _gaq=[["_setAccount","UA-XXXXX-X"],["_trackPageview"]]; (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1; g.src=("https:"==location.protocol?"//ssl":"//www")+".google-analytics.com/ga.js"; s.parentNode.insertBefore(g,s)}(document,"script")); </script> <!-- Bookmark Script --> <script> function bookmark_us(url, title){ if (window.sidebar) // firefox window.sidebar.addPanel(title, url, ""); else if(window.opera && window.print){ // opera var elem = document.createElement('a'); elem.setAttribute('href',url); elem.setAttribute('title',title); elem.setAttribute('rel','sidebar'); elem.click(); } else if(document.all)// ie window.external.AddFavorite(url, title); } </script> Hey guys, I'm using javascript in a menu to change the colour scheme of a page with frames and wondered how I could make this Javascript work across frames. The top frame is the colour picker with the Javascript and the bottom frame is the html template that will be changing colour scheme. JS: Code: var cols = { red: [ { el: '.headertitle', color: '#FF0000' }, { el: '#wrapper #maincontent #leftpanel ul.leftnavigation li a.current', bgcolor: '#FF0000', color: '#FFFFFF' }, { el: '#wrapper #maincontent #leftpanel', border: '#FF0000' }, { el: '#wrapper #maincontent #leftpanel ul.leftoffers li div.titlebody a', color: '#FF0000' }, { el: '#wrapper #maincontent #editable h2', color: '#FF0000' }, { el: '#wrapper #maincontent #rightpanel', border: '#FF0000' }, { el: '#wrapper #footer', bgcolor: '#FF0000' }, { el: '#wrapper #maincontent #leftpanel ul.leftoffers li', bgcolor: '#F6D9D9'}, { el: '.choosecolour', border: '#fff' }, { el: '#cbred', border: '#000' } ], orange: [ { el: '#header', bgcolor: '#ff8c10', color: '#ffffff' }, { el: '#nav li a', bgcolor: '#d63b18', color: '#ffffff', hoverbgcolor: '#fc6827', hovercolor: '#ffffff' }, { el: '.primaryBgCol', bgcolor: '#ff8c10', color: '#ffffff' }, { el: '.secondaryBgCol', bgcolor: '#f8a955', color: '#ffffff' }, { el: '.footerBgCol', bgcolor: '#f2441c' }, { el: '.footerTextCol', color: '#ffffff' }, { el: '.borderCol', border: '#ff8c10' }, { el: '#logo', src: 'images/logo_orange.gif'}, { el: '.choosecolour', border: '#fff' }, { el: '#cborange', border: '#000' } ] }; function changeColour(col) { $A(cols[col]).each(function(i) { $$(i.el).each(function(j) { if (i.bgcolor) j.setStyle({ backgroundColor: i.bgcolor }); if (i.color) j.setStyle({ color: i.color }); if (i.border) j.setStyle({ borderColor: i.border }); if (i.src) j.writeAttribute('src', i.src); // hover colours if (i.hovercolor || i.hoverbgcolor) { j.onmouseover = function() { this.setStyle({ backgroundColor: i.hoverbgcolor, color: i.hovercolor }); }; j.onmouseout = function() { this.setStyle({ backgroundColor: i.bgcolor, color: i.color }); }; } }); }); } JS picker HTML code: Code: <div class="colours"> <div class="choosecolour" id="cbred" style="background-color: #c90c12;" onclick="changeColour('red');"></div> <div class="choosecolour" id="cborange" style="background-color: #ff8c10;" onclick="changeColour('orange');"></div> </div> Anyone know how I can make the colour scheme of page in lower frame change when colour is picked in top page frame? I'm building a webpage using javascript and iframes. Basically I have an iframe in the middle of the index.html page that links to another html page (let's call it iframe.html). My question is, is it possible to call a javascript function from iframe.html to control an object on index.html? If so, how do I do this? I'd like to be able to assign an image in iframe.html with the hyperlink of href="javascript:function()", where the function effects the CSS of a div on index.html. Thanks I have a website with all of the months of the year. The main page of the website is suppose to be the current month. How can make my index page load automatically to the correct month. So if it is April, my index page will automatically load april.html. Thank you so much! Hello! I have a script that loads a popup window on any page of a website, in order to temporarily cover the page's content. This popup window is supposed to load on top of page's content, acting as a sort of page blocker. So the visitor can't see what's on the page until he clicks the popup. The problem i'm having right now is when i put this script on a page that has iframe content. The iframe loads on top of this popup and not underneath as it's supposed to be. Do you guys have any advise on what should i do to make this work properly when using iframes on a page? Here is the script: Code: var blocker_originalHtmlOverflow; var blocker_originalBodyOverflow; function blocker_addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { oldonload(); func(); } } } blocker_addLoadEvent(blocker_init); function blocker_init() { if(blocker_getCookie('content_unlocked')=='1') return; blocker_originalHtmlOverflow = document.getElementsByTagName('body')[0].style.overflow; blocker_originalBodyOverflow = document.getElementsByTagName('html')[0].style.overflow; document.getElementsByTagName('body')[0].style.overflow = 'hidden'; document.getElementsByTagName('html')[0].style.overflow = 'hidden'; function pageScroll() { window.scroll(0,0); // scroll to 0 if(blocker_getCookie('content_unlocked')!='1'){ scrolldelay = setTimeout('pageScroll()',100); // scrolls every 1 second } } pageScroll(); var haze = document.createElement('div'); haze.id = 'blocker_haze'; haze.style.filter = 'alpha(opacity=50)'; haze.style.opacity = .5; haze.style.height = '2000'; haze.style.width = '2000%'; haze.style.backgroundColor = '#000'; haze.style.position = 'absolute'; haze.style.top = '0px'; haze.style.left = '0px'; haze.style.zIndex = 1000000; var centerPane = document.createElement('centerPane'); centerPane.id = 'blocker_centerPane'; centerPane.style.width = '500px'; centerPane.style.height = '361px'; centerPane.style.border = '5px solid #CCC'; centerPane.style.position = 'absolute'; centerPane.style.left = '50%'; centerPane.style.marginLeft = '-250px'; centerPane.style.top= '100px'; centerPane.style.backgroundColor = '#FFF'; centerPane.style.zIndex = 1000001; centerPane.style.backgroundImage = 'url(http://www.fasgasfga.com/sfasdfasdf.jpg)'; centerPane.style.backgroundRepeat = 'no-repeat'; centerPane.style.backgroundPosition = '20px 10px'; centerPane.style.padding = '20px'; var h1 = document.createElement('h1'); h1.style.color = '#000'; h1.style.textAlign = 'center'; h1.style.fontSize = '36px'; h1.style.margin = '0 0 10px 0'; h1.style.padding = '8px 0 0 15px'; h1.style.fontFamily = 'arial'; h1.style.lineHeight = '36px'; h1.innerHTML = blocker_headline; centerPane.appendChild(h1); var p1 = document.createElement('p'); p1.innerHTML = blocker_instructionalText; p1.style.textAlign = 'center'; p1.style.padding = '20px 0 20px 0'; p1.style.margin = '0'; p1.style.fontSize = '18px'; p1.style.lineHeight = '18px'; p1.style.color = '#000'; p1.style.fontFamily = 'arial'; centerPane.appendChild(p1); var ul = document.createElement('ul'); ul.style.textAlign = 'center'; ul.style.margin = '0 0 10px 0'; ul.style.padding = '0'; ul.style.listStyleType = 'none'; for(var i = 0;i<blocker_surveryLinks.length;i++){ var li = document.createElement('li'); var a = document.createElement('a'); a.style.display = 'block'; a.style.fontSize = '17px'; a.style.lineHeight = '380px'; a.style.color = 'Black'; a.style.fontFamily = 'arial'; a.style.textDecoration = 'underline'; a.target = '_blank'; a.href = blocker_surveryLinks[i].url; a.innerHTML = blocker_surveryLinks[i].text; a.onclick = function(){ window.setTimeout(unblockContent, 55000); } li.appendChild(a) ul.appendChild(li); } centerPane.appendChild(ul); var p2 = document.createElement('p'); p2.style.textAlign = 'center'; p2.innerHTML = blocker_footerText; p2.style.padding = '20px 0 0 0'; p2.style.margin = '0'; p2.style.color = '#F50E0E'; p2.style.fontFamily = 'arial'; p2.style.fontSize = '15px'; p2.style.lineHeight = '15px'; centerPane.appendChild(p2); document.getElementsByTagName('body')[0].appendChild(haze); document.getElementsByTagName('body')[0].appendChild(centerPane); } function unblockContent(){ document.getElementsByTagName('body')[0].style.overflow = blocker_originalBodyOverflow; document.getElementsByTagName('html')[0].style.overflow = blocker_originalHtmlOverflow; document.getElementById('blocker_haze').style.display = 'none'; document.getElementById('blocker_centerPane').style.display = 'none'; //blocker_setCookie("content_unlocked", 1, 365, '/', ''); Set_Cookie( 'content_unlocked', 1 , 365, '/', '', '' ); } function Set_Cookie( name, value, expires, path, domain, secure ) { // set time, it's in milliseconds var today = new Date(); today.setTime( today.getTime() ); /* if the expires variable is set, make the correct expires time, the current script below will set it for x number of days, to make it for hours, delete * 24, for minutes, delete * 60 * 24 */ if ( expires ) { expires = expires * 1000 * 60 * 60 * 24; } var expires_date = new Date( today.getTime() + (expires) ); document.cookie = name + "=" +escape( value ) + ( ( expires ) ? ";expires=" + expires_date.toGMTString() : "" ) + ( ( path ) ? ";path=" + path : "" ) + ( ( domain ) ? ";domain=" + domain : "" ) + ( ( secure ) ? ";secure" : "" ); } function blocker_setCookie(c_name,value,expiredays){ var exdate=new Date();exdate.setDate(exdate.getDate()+expiredays); document.cookie=c_name+ "=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString()); } function blocker_getCookie(c_name){ if (document.cookie.length>0){ c_start=document.cookie.indexOf(c_name + "="); if (c_start!=-1){ c_start=c_start + c_name.length+1; c_end=document.cookie.indexOf(";",c_start); if (c_end==-1) c_end=document.cookie.length; return unescape(document.cookie.substring(c_start,c_end)); } } return ""; } Hi, I'm currently working on my portfolio website and would like to have information about my movie clips be retrieved from an XML document when a thumbnail is clicked. I am building my website in HTML and would like to retrieve the Xml using JavaScript. Any help would be appreciated. My XML is valid and structured as such: <?xml version="1.0" encoding="UTF-8"?> <work> <motion> <reel> <title id="Demo Reel 2009" project="Self Promotion" client="Self"> <![CDATA[This demo reel is primaraly a collection ......]]> </title> </reel> . . . . These are my initial variable definitions and readXML function in javascript: <script language="javascript"> var xmldom, workNode, motionNode, printNode, fineartNode, displayNode, titleNode; function readXMLDocument() { xmldom=createDocument(); xmldom.async=false; if (xmldom.parseError != 0) { alert("An error occurred: \nError Code " + xmldom.parseError.errorCode + "\n" + "Line: " + xmldom.parseError.line + "\n" + "Line Pos: " + xmldom.parseError.linepos + "\n" + "Reason: " + xmldom.parseError.reason); } else { alert("Document: " + xmldom.documentElement); alert("Root: " + xmldom.documentElement.tagName); alert("Child: " + xmldom.documentElement.firstChild.tagName); alert("Xml DOM: " + xmldom.xml); } xmldom.load("workinfo.xml"); workNode=xmldom.documentElement; motionNode=workNode.firstChild; printNode=motionNode.nextSibling; fineartNode=printNode.nextSibling; } . . . . A call to function revealText is called "onClick" of a thumbnail as such: <a href="videopages/reel.html" class="vid" target="video" onClick="revealText(0)"> This is function revealText: function revealText(x) { var title, project, client, info; readXMLDocument(); displayNode=motionNode.childNode[x]; titleNode=displayNode.firstChild; title=titleNode.getAttribute("id"); project=titleNode.getAttribute("project"); client=titleNode.getAttribute("client"); info=titleNode.getNodeValue(); titleSpan.innerHTML=title; projectSpan.innerHTML=project; clientSpan.innerHTML=client; infoSpan.innerHTML=info; } </script> and these are the spans they are written to: <span id="titleSpan" class="vidinfo"> <span id="projectSpan" class="vidinfo"> <span id="clientSpan" class="vidinfo"> <p id="infoSpan" class="content"> If you have read this far, I REALLLLY appreciate it. And any ideas as to what is wrong would help alot. I have an external Javascript file that only works when I put: Code: <script type="text/javascript" src="external.js"></script> at the end of the HTML page. Does anyone know why it won't work in the head of the page? Thanks I have a form that used php to load a random image but now i would like to use javascript instead and am sure I nearly have it. I need to have a random number between 0 -5. Here is my code Code: <script type='text/javascript'> var random = Math.floor( Math.rand() * 6); document.write("<img src='images/'"+random+"'.jpg' alt='random image' /><input name='image' type='hidden' value='"+random+"' />") </script> Hello everyone, I am just beginning to learn javascript, and I am trying to create a little game where when a user hovers over a picture it changes, and things like that. At the moment I have been trying to make it so that the pictures tile so they fill the whole page area, dynamically so that it changes depending on the users browser size (px). The images have many attributes so I can't just tile them with css as they need to be actual elements. The problem is the code doesn't run, and I can't work out why. I think all the lines that require it have semi colons and its all correct. Forgive me if the answer is clear but as I said I only just started learning. Anyway, on with the code: Code: <!doctype html> <html lang="en"> <head> <title>Hi, I'm a button.</title> <link rel="stylesheet" type="text/css" href="style.css"> <script type="javascript"> function mainDo() { if (document.body && document.body.offsetWidth) { winW = document.body.offsetWidth; winH = document.body.offsetHeight; } if (document.compatMode=='CSS1Compat' && document.documentElement && document.documentElement.offsetWidth ) { winW = document.documentElement.offsetWidth; winH = document.documentElement.offsetHeight; } if (window.innerWidth && window.innerHeight) { winW = window.innerWidth; winH = window.innerHeight; } document.write('Width = ' + winW + 'Height = ' + winH); winW=winW/127; winH=winH/128; winW=Math.round(winW); winWs=winW; winH=Math.round(winH); winHs=winH; document.write('Width = ' + winW + 'Height = ' + winH); while (winH>0) { while (winW>0) { document.write('<img onMouseover="this.src=\'img/hibutton_orange.png\'" onClick="this.src=\'img/hibutton_green.png\'" ondblClick="this.src=\'img/hibutton_blue.png\'" src="img/hibutton_blue.png">'); winW=winW-1; } document.write('\n' + '<br>'); winW=winWs; winH=winH-1; } } </script> </head> <body onload="maindo()"> </body> </html> im trying to onclick function on the button but in firebug it will say, function not defined, i even tried to do it with a internal script, but still it will not work. please help Code: <!DOCTYPE html> <html> <head> <script type="text/javascript" src="s/i.js"> </script> </head> <body> <button id="fihkhjsdk" onclick="ff();"> dsfh </button> <php code...> </body> </html> CHANGE XX to TT CHANGE zero in c0m to O becoming com CHANGE YYY to WWW hxxps://yyy.yousendit.c0m/download/dklxb2VIcVg1aWF4dnc9PQ first an example of what im trying to do: when logging in to a forum, you enter your info at the top right corner. thts where the login info txt boxes are usually located. under these you'll find a menu bar. if you're logged in, the menu commands/items arent the same as when you're not logged in. example of logged in is search. example of not being logged in is register. anyways under the menu there's the forum itself. u no, sections and topics. the table basically. this is wht im trying to do. even if im doing it wrong plz indulge me I know that ppl dont use frames much anymore. but just go with it. It DOES help to no how to do something in different ways. Ok, assuming you setup my pages, press submit. All 3 frames SHOULD go to 1.php BUT what happens is that the lower two frames go to 1.php. the first frame doesnt. It's the frame that has the form which has the button. If i put the button outside the form and press submit, it works. all 3 frames change. so i'm guessing it's got to do with the form itself. How do I fix it? Thank you!!!! Hi, I am an asp.net developer and I wanted to display user popup (kind of) which freezes the screen so that user won't click anything else on the screen. There are some predefined controls in asp.net, but I wanted do this using Javascript. Where can I find a sample with code? Thanks Hello, I have develop a piece of code that when the user loads the html page it will load a local image but if the image doesn't exist it will load from a remote server. The question that remains is if it's possible to make an event in case the image is load locally? 1) HTML Page is load 2) If image doesn't exist locally reload from the server 3) If the image is load locally report back to the site Is the 3) possible? Greetings, I am looking for either a JavaScript or Coldfusion solution to the following problem. First, there are over 60 million product photos so downloading and resizing the photos using Coldfusion would be very tedious. I would like the display an image within a 100 x 100 pixel container. If the height or width of the image is great than 100 pixels, the image should reduce in size to fit within the 100 x 100 pixel container. I want to avoid pixelation of the images as much as possible. All images are external and not on the local server so I only have an image URL. I would like to hide all images until they are resized appropriately. Does anybody know of a piece of javascript code that can do something similar to this? Sincerely, Travis Walters |