JavaScript - Javascript:history.go(-1) Inside Frame
I have a stupid problem...
Page 1 and Page 2 have a link to Page 3 Page 3 is a html page, the frame source is Page 4 There is a javascript:history.go(-1) link on Page 4. I want to go back to page 1 (not inside the frame, i want it to go back to the previous page just like when you click the "back" button of your browser) or go back to page 2 (whichever one is the last page) but the link doesn't work because it's inside a frame... If i go directly to page 4 without using the page with the frame (page 3) the link will work and get me back to page 1 or page 2... some help would be appreciated !! Similar TutorialsHi I am using back button with javascript:history.back(); on it but the page I want to go back have anchor link smth like: http://example.com/index.php#anchor_link How do I go back ? I've tried javascript.history.go(-1); a 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- trying to set frame source from javascript- i cant get it to work.. Code: <script> stud = mm_adl_API.LMSGetValue("cmi.core.student_id"); newlink = ('https://blah.blah.blah&stud_id='+stud); // --> </script> <frameset rows="*,80" frameborder="no" border="0" framespacing="0"> <frame src="javascript:window.location(this.newlink)" name="thisname" /> <frame src="bottom.html" name="bottomFrame" scrolling="No" noresize="noresize" id="bottomFrame" title="Scorm Handling" onload="mm_adlOnload()" /> </frameset> I have a page that open two frames. Second frame, most of the page, is empty. First frame contains a form that retrieves user input, when you click the button, it send that input back to the original parent html, which detects the GET parameters, and builds a custom URL. I want to then load that custom URL in the 2nd empty frame. I figure I need to modify the src atttribute of the 2nd frame in the frameset, but I can't make it work. Code: <frameset id='parent' rows='10%,90%'> <frame id='frm1' src='./form.html' /> <frame id='frm2' src='' /> </frameset> <script>modFrmSrc();</script> where modFrmSrc() checks for the GET values, builds the URL, and then tries to load the URL in frm2. Is there a way to get this done? Please help me make the links below open in the "top" or "parent" frame of a window. For example, in HTML, you would use
Code: <a href="URL" target="_top">LINK</a> I just do not know how to make the links below perform in the parent window. (or even a new window if that is only possible.) Code: var $el, $tempDiv, $tempButton, divHeight = 0; $.fn.middleBoxButton = function(text, url) { return this.hover(function(e) { $el = $(this).css("border-color", "white"); divHeight = $el.height() + parseInt($el.css("padding-top")) + parseInt($el.css("padding-bottom")); $tempDiv = $("<div />", { "class": "overlay rounded" }); $tempButton = $("<a />", { "href": url, "text": text, "class": "widget-button rounded", "css": { "top": (divHeight / 2) - 7 + "px" } }).appendTo($tempDiv); $tempDiv.appendTo($el); }, function(e) { $el = $(this).css("border-color", "#999"); $(".overlay").fadeOut("fast", function() { $(this).remove(); }) }); } $(function() { $(".widget-one").middleBoxButton("Action Games","action.htm"); $(".widget-two").middleBoxButton("Adventure Games", "adventure.htm"); $(".widget-three").middleBoxButton("Arcade Games", "arcade.htm"); $(".widget-four").middleBoxButton("Puzzle Games", "puzzle.htm"); $(".widget-five").middleBoxButton("Sport Games", "sport.htm"); $(".widget-six").middleBoxButton("Search Games", "searchgames.htm"); }); Thank you very much for your help!!! Here is the structure I am working with as this html/script was created by the chmProcessor to produce WebHelp files... index.htm contains: Code: <iframe id="mainFrame" name="mainFrame" class="full" src= "frameset.html"> frameset.html contains: Code: <frameset cols="20%,80%"> <frame id="treeFrame" src="tree.html" name="treeFrame" /> <frame id="frameCont" src="2_Welcome.htm" name="Welcome" /> </frameset> tree.html is the navigational panel and contains: Code: <script type="text/javascript" src="tree.js"> </script> I have placed alert() calls in tree.js. When I load index.htm in Chrome, apparently tree.js is not being loaded because I do not see any alert box and the functionality within tree.js does not work. Note: The functionality does work in IE and Firefox If I open tree.html directly in Chrome, the tree.js functionality does get called. I do not know how to solve this problem or why Chrome is not loading the pages and script correctly. Thanks for your help! Hi. I have a question about java script code. I'm creating a website with frames. Within the main page frame, there are tables in the main content page. When I created the website, it fit perfectly in the browser window of my smaller laptop. I just checked it out on my old G5 and the images/pages are too big and either cut off or scroll bars appear (which is not what I want) So I wanted to know what code I put in my files and where to put it? Also, what pages does it need to be in? the main frame index page? the specific pages that fit within the frames? some are images that load in the frames? would i need to create an .html for those and then have the .jpg load so that it can be resized? I need the main page to be resized to fit the browser as well as the pages in the frames to fit. Can you help? Thanks I' am trying to do a frame by frame animation, lik an animated gif. I am using svg (vector graphics) and IE9 has native support for svg. The code functions in every other browser but IE9 plays the animation once then nothing. If you would like to try and not have svg files you can use whatever gif,jpg or png just put an img-tag where i have embed. Code: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Animation</title> <style type="text/css"> /*One div per image all uses this class*/ .eyesPos { position:absolute; width:80px; height:50px; z-index:1; left: 0px; top: 0px; } #eye_wrapper{/*This is a master div for easy placement of the others*/ position:absolute; width:80px; height:50px; z-index:2; left: 275px; top: 200px; } </style> <script> var eyes=["a","b","c","d"];//Image id in this array var startAnim=setInterval(visaOga,100);//Animation speed function visaOga(){ document.getElementById(eyes.splice(0,1)).style.display="block"; if(eyes.length==0){ document.getElementById("a").style.display="none"; document.getElementById("b").style.display="none"; document.getElementById("c").style.display="none"; dBort = function(){ document.getElementById("d").style.display="none"; eyes=["a","b","c","d"]; } setTimeout(dBort,1500);//So last image is shown 1.5 sec return;//Aborts - dBort -. Sequence can start over if(document.getElementById("d").style.display=="none"){ startAnim;//Strts sequence if last image invisible } } } </script> </head> <body> <!--Images in own div invisible at start--> <div id="eye_wrapper"> <div class="eyesPos" id="a" style= display:none;> <embed src="0.svg" width="80" height="50" /> </div> <div class="eyesPos" id="b" style= display:none;> <embed src="1.svg" width="80" height="50" /> </div> <div class="eyesPos" id="c" style= display:none;> <embed src="2.svg" width="80" height="50" /> </div> <div class="eyesPos" id="d" style= display:none;> <embed src="3.svg" width="80" height="50" /> </div> </div> </body> </html> I've been fooling around with developing an IETMs interface (Interactive Electronic Technical Manual - like an interactive parts catalogue) to display the data live from an existing Access database. The idea is to be able to run this interface on a network hosted intranet with straight HTML, plain Javascript, VBScript & ActiveX objects, so that it doesn't require IIS etc to run ASP or PHP etc (I don't want to involve corporate IT for the IIS). All is going pretty well, & I'm impressed with the setup except for a few minor things - checking if a frame is loaded, & global variables. My setup is a HTML page hosting 5 frames with each containing an empty <DIV> (which gets the page written to it dynamically), but I need to ensure all frames are loaded before getting into the heavy stuff (which Javascript is handling brilliantly!). But I'm finding that Javascript sux at truly detecting if a frame is loaded (someone please prove me wrong!). I have all 5 frames call a function fnInitialiseIfReady(), then if I could either successfully test if all frames are loaded, or if I could globally count if this function has been called 5 times, I can proceed with confidence & call my function fnInitialise(). But unfortunately neither is working for me. From tireless internet searches, I've tried the 'frames always load in order' theory, & that is simply not correct. I have set up a test with the frames calling a function passing their name as a parameter, & each time the frames load in a different order every time. It is totally random. Note: I proved this by having the first 4 frames call a certain function(which contains an alert() line showing the frame name parameter passed), & having the last frame call a different function (which contains an alert("all are loaded!") line). The "all are loaded!" does not always appear last. I've also tried the '.frames["FrameName"].document.loaded' approach, & it ALWAYS returns 'undefined' for every frame. Am I doing something wrong here? I've also tried the '.frames["FrameName"].window.location.href' approach & it ALWAYS returns the html filename regardless of whether that page has loaded or not, so it is not an indicator of loading completion. I've also tried the '.frames["FrameName"].document.location' approach & it's ALWAYS the same as the '.window.location.href' approach. Also, I'm finding Javascript will not hold global variables for me at all. I don't know if it's a combination of multiple frames & using Javascript & VBScript together, but global variables just do not hold a value at all. Local variables (within functions) are fine. Any ideas? I don't have many globals, so I'm thinking of using a cookie. A valid Solution? BTW, the reason for also using VBScript is that it accesses the ActiveX controls by default, & being a corporate intranet app I can guarantee MSIE usage. It's frustrating because if I can solve these 2 relatively minor issues, then I'm super impressed with the robustness of this Javascript/VBScript approach. By leveraging each of their strengths, it's crunching the data just as quickly as the VB, C#, & C++ programs I've written for this particular dataset. I'm impressed! Thanks in advance, Dave Lock. I have an older website consisting of frames (html). Now I want to password protect one page. So far I added the following Javascript which I found on youtube: <SCRIPT> function passWord() { var testV = 1; var pass1 = prompt('Please Enter Your Password',' '); while (testV < 3) { if (!pass1) history.go(-1); if (pass1.toLowerCase() == "letmein") { alert('You Got it Right!'); window.open('protectpage.html'); break; } testV+=1; var pass1 = prompt('Access Denied - Password Incorrect, Please Try Again.','Password'); } if (pass1.toLowerCase()!="password" & testV ==3) history.go(-1); return " "; } </SCRIPT> <CENTER> <FORM> <input type="button" value="Enter Protected Area" onClick="passWord()"> </FORM> </CENTER> This works but the protected page opens in a new window not in the main frame. What do I have to add and where? Will search engines pick up this page and display it on the public? Thank you. CT guys help pls.. i need to pass the data in the textfields from the left frame to the textfields in the right frame of my frameset. (ex: dslnum of frame1 will be pass to txtDSLTN of frame2) frame1: http://www.mediafire.com/?hge1ws29mdhmu7e frame2: http://www.mediafire.com/?k83cb64wbpskw97 thanks in advance! I am currently creating a page to allow a user to change their password. I have a field which the user will enter their current password into and I am then using javascript to check whether this is the correct password. My passwords are encrypted using md5 and so I need to incorporate this into the javascript function. I have tried but unfortunately cannot get the correct value for the encrypted password. My javascript code is as follows... Code: function verifyCurrentPassword(){ //Gain the hashed password that is in the database var password; <?php print "password='" .$password. "';\n"; ?> //Find the password that the user has entered as the current password var hashedpassword; var currentpassword = document.getElementById("currentpassword").value; <?php print "hashedpassword='" .md5("currentpassword"). "';\n"; ?> if(password == hashedpassword){ alert("passwords are the same"); } } im trying to incorporate a tweetme button....inside of my joomla myblog component i entered into the core html with php tags of the blog....went to the bottom and added in the javascript for the twitter button....it worked but i want the url of the twitter button to point to the specific url's of each blog post so i simply grabbed the php tag from the top of the post that determines the link for the title of the blog Code: <?php echo $e['permalink']; ?> this is the code i ended up with Code: <script type="text/javascript"> tweetmeme_url = '<?php echo $e['permalink']; ?>'; </script> <script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script> it gave me a syntax error..... is there anyway to make this situation possible? Hello, I'm developing very simple web site for my gym. It has a main page, index.php and several secondary pages e.g. home.php, services.php, location.php. Secondary pages are reachable via php script called through navigation bar located in index.php. Once it's called the pages are loaded inside a main frame, which is located in index.php as well. Everything works fine, except when I add javascript code (which presents map of the gym) inside location.php site. Body of location.php looks like this: <body> <h2>Lokacije fitness centara<br></h2> <p>"Fitness centar Adam"</p> <script type="text/javascript" src="http://www.karte.hr/api.js?v=1.0"> </script> <div id="karte_hr_karta" style="border:1px solid #C5C5C5;width:450px; height:400px;"> <a href="http://www.karte.hr/karta/g-l-fitness-adam-i-eva">Interaktivna karta Hrvatske | Interactive map of Croatia</a> <script type="text/javascript"> new karteHR({container:"karte_hr_karta", slider:true, onload:function() { this.viewer.setViewBound(2452469, 5064256, 2471292, 5073038); this.kartehr.loadMyMap({mid:43425, nosetbound:true}); }}); </script>" </div> </body> When I call location.php through navigation bar from index.php, the whole page reloads (instead of main frame only). It really gets on my nerves - just can see 2-3 milliseconds an empty page until the whole page appears... I'm not really familiar with Javascript neither with PhP, but I assume it's because of onload:function(). I got this code from map service from my country (http://www.karte.hr/). I've tried to change it but it didn't work and now I have absolutely no idea what to do. If it's permitted I can post a link to this web site so you can easily understand my issue. Thank you very much. Aleksandra Hi all! I'm trying to make the width of an image relative to the width of the browser. I use this script to find the browser width: Code: var imageWidth = 0; if( typeof( window.innerWidth ) == 'number' ) { //Non-IE myWidth = window.innerWidth; } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) { //IE 6+ in 'standards compliant mode' myWidth = document.documentElement.clientWidth; } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) { //IE 4 compatible myWidth = document.body.clientWidth; } imageWitdh = myWidth*0.3; Now I want my image to have the width equal to imageWitdh... how can I do this? <img src="someimage.png" width="imageWitdh"> doesnt work, abviously... Thanks a lot!!! Grts ok, so I have a code where it takes documents and uploads them as soon as selected. I want to know how I can put in my genRandomString() in so that not only will the doc upload, but this random string will submit to database, but I need this string to be the same for all documents that are uploaded on a single page load.....when page refreshes, new string, else it stays the same. I am going to link this number as an id in the database so that it can be identified. does this make any sense at all?????? Code: <?php function genRandomString($length = 20) { $characters = '0123456789'; $string =''; for ($p = 0; $p < $length; $p++) { $string .= $characters[mt_rand(0, strlen($characters))]; } return $string; } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Multiple File Upload With Progress Bar - Web Developer Plus Demos</title> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript" src="js/swfupload/swfupload.js"></script> <script type="text/javascript" src="js/jquery.swfupload.js"></script> <script type="text/javascript"> $(function(){ $('#swfupload-control').swfupload({ upload_url: "upload-file.php", file_post_name: 'uploadfile', file_size_limit : "9999999999999999999999999999999999", file_types : "*", file_types_description : "Image files", file_upload_limit : 1000, flash_url : "js/swfupload/swfupload.swf", button_image_url : 'js/swfupload/wdp_buttons_upload_114x29.png', button_width : 114, button_height : 29, button_placeholder : $('#button')[0], debug: false }) .bind('fileQueued', function(event, file){ var listitem='<li id="'+file.id+'" >'+ 'File: <em>'+file.name+'</em> ('+Math.round(file.size/1024)+' KB) <span class="progressvalue" ></span>'+ '<div class="progressbar" ><div class="progress" ></div></div>'+ '<p class="status" >Pending</p>'+ '<span class="cancel" > </span>'+ '</li>'; $('#log').append(listitem); $('li#'+file.id+' .cancel').bind('click', function(){ //Remove from queue on cancel click var swfu = $.swfupload.getInstance('#swfupload-control'); swfu.cancelUpload(file.id); $('li#'+file.id).slideUp('fast'); }); // start the upload since it's queued $(this).swfupload('startUpload'); }) .bind('fileQueueError', function(event, file, errorCode, message){ alert('Size of the file '+file.name+' is greater than limit'); }) .bind('fileDialogComplete', function(event, numFilesSelected, numFilesQueued){ $('#queuestatus').text('Files Selected: '+numFilesSelected+' / Queued Files: '+numFilesQueued); }) .bind('uploadStart', function(event, file){ $('#log li#'+file.id).find('p.status').text('Uploading...'); $('#log li#'+file.id).find('span.progressvalue').text('0%'); $('#log li#'+file.id).find('span.cancel').hide(); }) .bind('uploadProgress', function(event, file, bytesLoaded){ //Show Progress var percentage=Math.round((bytesLoaded/file.size)*100); $('#log li#'+file.id).find('div.progress').css('width', percentage+'%'); $('#log li#'+file.id).find('span.progressvalue').text(percentage+'%'); }) .bind('uploadSuccess', function(event, file, serverData){ var item=$('#log li#'+file.id); item.find('div.progress').css('width', '100%'); item.find('span.progressvalue').text('100%'); var pathtofile='<a href="uploads/'+file.name+'" rel="nofollow" target="_blank" >view »</a>'; item.addClass('success').find('p.status').html('Done!!! | '+pathtofile); }) .bind('uploadComplete', function(event, file){ // upload has completed, try the next one in the queue $(this).swfupload('startUpload'); }) }); </script> <style type="text/css" > #swfupload-control p{ margin:10px 5px; font-size:0.9em; } #log{ margin:0; padding:0; width:500px;} #log li{ list-style-position:inside; margin:2px; border:1px solid #ccc; padding:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#333; background:#fff; position:relative;} #log li .progressbar{ border:1px solid #333; height:5px; background:#fff; } #log li .progress{ background:#999; width:0%; height:5px; } #log li p{ margin:0; line-height:18px; } #log li.success{ border:1px solid #339933; background:#ccf9b9; } #log li span.cancel{ position:absolute; top:5px; right:5px; width:20px; height:20px; background:url('js/swfupload/cancel.png') no-repeat; cursor:pointer; } </style> </head> <body> <div id="swfupload-control"> <p>Upload upto 5 image files(jpg, png, gif), each having maximum size of 1MB(Use Ctrl/Shift to select multiple files)</p> <input type="button" id="button" /> <p id="queuestatus" ></p> <ol id="log"></ol> </div> </body> </html> in a javascript file that contains the following code, is there a way to hyperlink the word ELEPHANT ? $j('#message').html("white ELEPHANT"); Hello everyone, I have session_start() at the begining of my home page. In my home page I'm calling a fileName.js inside my <head></head> tags. My guestion is... How do I get the session id inside fileName.js? Or is there a way to pass it to fileName.js from the home page(index.html)? Thank You in advance. I have multiple <?php require("../section.php"); ?> on my pages and I would like to insert some Javascript (for Facebook's social bookmarks plugins) in one of these so that it comes right before the </body> tag. Currently my "footer.php" require is in that position so I open the footer.php and place the Javascript at the end. Code: <?php echo ' Footer Content Here's my Javascript '; ?> It gives a syntax error in Dreamweaver halfway through the JS and the footer.php doesn't show at all when uploaded. Can you not insert JS this way? How would I do this? I don't know anything about Javascript so be easy. Hi all, first post and a bit of a newb, so please be gentle I have a file that generates web galleries in Adobe Lightroom. They are generated depending on which files are selected and the metadata in those files. Basically it is a series of pages of thumbnails called index.html index_1.html index_2.html etc. Then a set of pages for each individual image. An example can be seen he http://68.169.32.107/jonrouston/clients/su-dathan/ (the page navigation links are not great, but I have addressed that, they're at the bottom >> ) Currently if a user clicks on a photo there is a 'return to thumbnails button at the top, but this always takes them to /index.html So the user could be at a picture after browsing to /index_39.html and still get returned to /index Is there any way I can use history.go to find the last instance of index.html Or index_x.html (where x is any number) and take them back to that instead? Thanks for any help Jon |