|
JavaScript - Js In Iframe Affecting Anchors Of Main Window, Help Please!
First, apologies I'm a newbie with javascript. Here's the problem: I have javascript in an iframe that controls showing/hiding of divs. This works great, but after the javascript is executed it changes the behavior of anchor tags of the main window of the website (namely - links in the main window all open in new windows and not in the specified target iframe). I've searched and searched and looked up all sorts of things, rendering me a confused and frustrated fellow.
here's the script: <script language="javascript"> function show(thechosenone) { var newboxes = document.getElementsByTagName("div"); for(var x=0; x<newboxes.length; x++) { name = newboxes[x].getAttribute("name"); if (name == 'newboxes') { if (newboxes[x].id == thechosenone) { newboxes[x].style.display = 'block'; } else { newboxes[x].style.display = 'none'; } } } } </script> and in the body: <a id="myHeader2" href="javascript:show('myDiv');" >click here to show div</a> ANY help is greatly appreciated! Similar TutorialsOk, 'nother head-banger for the hardcore! I have a "contact us" <a> with the id 'contact' on the main page, which is supposed to change the source file of an iframe to the contact page. Except when I click on "contact us" nothing happens. I've tried to get this to work several different ways, and suspect that the problem is purely syntax, but I just haven't been able to figure it out. Here's the code: The snippet on the main page (index.html): Code:
<div id="linkListContact" class="LinkList">
<img id="linkListContactBg" class="SideBarBgImg" src="Assets/Backgrounds/SideBar/ContactBg.png"></img>
<span>
<ul>
<li>
<div><a id="contact">Contact Us</a>
</div>
</li>
</ul>
</span>
</div>
... and the relevant Javascript: Code:
function setIFrame(frameSource)
{
document.getElementById('mainWindow').src = frameSource;
}
function setContactLink()
{
var contactURL = "http://katabasis.spreadshirt.com/shop/imprint"
document.getElementById('contact').onclick = new Function ( "setIFrame( 'contactURL' )" );
}
The setIFrame function is used to call the content initially when the page loads, and is working beautifully in that context. You can see the problem in action at the actual site: www.katabasis-apparel.com. Thanks. I have the code below in my popup window which currently brings up a blank page in the background as the main window. Instead I want the popup to come up but the original page I left is in the background as the main window. Does anyone know how I can do that with the code I currently have. Code: <html>
<head>
<title>JavaScript Popup Example 3</title>
</head>
<script type="text/javascript">
function poponload()
{
testwindow = window.open("", "mywindow", "location=0,status=0,scrollbars=0,width=350,height=400");
testwindow.moveTo(0, 0);
testwindow.document.write('<h1>Get outta here!</h1><a href="javascript:void(0);" onclick="window.opener.history.go(-1); self.close();">Parent back button</a>');
testwindow.focus();
}
</script>
<body onload="javascript: poponload()">
</body>
</html>
In my main window, I create a popup window. Is there a way to bring the main window back to the foreground (make the main window the focus window again) from the popup window using JS? Like from a link or a button? Thanks Hi Guys, I have a pop up that opens for a second then hides behind main window for some reason Code: <img src="../../../print_this_page.gif" title="Click To Print This Page" width="64" height="64" onmousedown="MM_openBrWindow('{ads_print_href}?item_id={item_id}','printnew','scrollbars=yes,width=950,height=800')" />
Any ideas what i can add to the code so it stays in top. Works on firefox. Issue is with IE8 Thanks Hi, I'm having troube closing the main Internet Explorer window using a script called from a right click menu. The code I'm using is: Code: <script language="JavaScript"> var oWindow = window.external.menuArguments; oWindow.close(); </script> When the script calls, windows prompts to close the window, but when 'yes' is clicked the Alert sound sounds and the window remains open! If the script is called from a button on the page it will close, but I want to close any page on the internet using a right click! All help will be gratefully received. Dave. I have the following HTML code in main.html: Quote: ............. ............. <tr align="right"> <td width="50%"> ... ... ... </td> <td width="50%"> <iframe src="../createproject.html width="100%" height="400pt" frameborder="0" scrolling="no"> </iframe> </td> </tr> ........... ........... and createproject.html: Quote: <html> <head> <link rel="stylesheet" type="text/css" href="../user.css" /> <script type="text/javascript" src="../projects.js"></script> <head> <body onload="return capture_profile()"> <div align="right" class="data-font"> <form action="/cgi-bin/createproj.cgi" method="POST"> <fieldset> ....... ....... ....... </fieldset> </form><br/> </div> </body> </html> I'd like capture with capture_profile() function in createproject.html a value into main.html page. How can I solve this problem with javascript? 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 have a PARENT HTML page. Within it, there is an iFrame. Let us call page inside of iFrame is CHILD. I would like to following things: 1. When click button in CHILD, A NEW full size page opens and mouse focus moves to NEW. I used following scripts: function openFullWin(urlPara) { var windowFeatures = 'menubar=1,modal=0,resizable=1,scrollbars=1,status=1,toolbar=1,width=' + screen.availWidth + ',height=' + screen.availHeight + ',left=0,top=0'; var winNew = window.open(urlPara, '', windowFeatures); winNew.focus(); this.blur(); } In Firefox, if only PARENT widow there. It works property. However, if there is another window there, the focus moved to that window rather than the NEW. In IE, if there is another window there, the NEW open as a tab in that window, rather than as tab in PARENT. 2. When click button in CHILD, A NEW full size page opens and mouse focus moves to NEW. At meantime, the CHILD changes to a NEWCHILD page, but not on focus. I am never being able to do this. Please help. 3. When click button in CHILD, A NEW full size page opens to replace PARENT. Of course, the CHILD disappeared too. I am never being able to do this. Please help. Alright I have an Iframe, and at the end of that Iframe I have set a variable with JS to be equal to TRUE, indicating that the page has run through the script. I then check that the iframe from the parent window for that variable, if it has not been set yet (or does not equal true) it reloads the iframe. The code works fine FF and Opera. However in IE it does not reload the frame if it is not true, and in Chrome it alerts undefined and does not reload the frame. I have tried accessing the frame through the dom and it did not work for me, and i have also tried simply adding a tail to the iframes source with no success. PHP Code: <iframe name="ifrOne" src="iframe.htm" id="ifrOne"></iframe> <script type="text/javascript"> function frameLoad() { var testOne = window.ifrOne.test_var; if(testOne !== "TRUE") { alert(testOne); document.getElementById('ifrOne').contentDocument.location.reload(true); window.frames['ifrOne'].location.reload(true); } } </script> Hi all. First post so please be gentle. My sites has a menu on the home page linking to a dozen other pages. My intention is to open those items into a main iframe also on the home page. I have put the <base target="iframe" > in the <Head> area and all seems to work in Opera but Internet Explorer and Firefox will both open new windows instead of loading into the iframe. Having said that. Links from WITHIN the iframe will open correctly in all browsers. Ideas in newbie-speak very much appreciated Regards, Phil I have a system on my website that logs users in. Once the user is logged in, I need the popup window that it takes place in to close and the parent window to refresh. This system could go through different pages depending on if the user has even been there before, etc., but the ending page will always be the same. I tried writing my own JavaScript for this, but since I do hardly any work with it, I can't get it to work quite right. Here is what I have, which I believe to be pretty close to what I want the end result to be: Code: <script type="text/javascript">
var iframe = document.getElementById("IFRAME ID").contentWindow.location.href;
var url = "ENDING PAGE URL";
function LoadFrame() {
if (iframe == url) {
window.close();
if (window.opener && !window.opener.closed) {
window.opener.location.reload();
} else {
}
</script>
So I guess that I'm asking what do I need to change/add/fix/get rid of/whatever to make this work? The following script will take the option parameter from the page URL and scroll the page to the element which has the matching ID. For example: mypage.html?element3 will cause it to scroll to the element which has an id="element3" when the page loads. Code: <html><head><title></title>
<script type="text/javascript">
function OptionScroll(){
if (location.search.length > 0){
LocnId=unescape(location.search.substring(1))
scrollLocn = document.getElementById(LocnId).offsetTop
document.body.scrollTop = scrollLocn
}
}
</script>
</head>
<body onload="OptionScroll()">
...etc....
This works fine. Now for the next step, I want to be able to do this from a script embedded in an iframe. In other words, when the page loads, the iframe will load and a script within the iframe executes taking the parameter from the parent page's URL, and then scrolls the parent page to the element with the matching ID. Is it possible to do this? Hello all, From what I've seen there isn't really a solution to this problem, but I thought I'd try my luck. I'm trying to code a website that's built around an iframe (as in, the nav bar links to content which appears in a central iframe). Now, in one of my pages I've got links that are supposed to open a small text block when they're clicked. I've figured out how to do this using either divs or the DHTML window widget (http://www.dynamicdrive.com/dynamici...ndow/index.htm), but in both cases the tab appears inside the iframe, and it's pretty cramped. I want to position it relative to the parent window, not the iframe, but so far haven't been able to figure out how to do this. Does anyone have an idea? Thanks! I know next to nothing about javascript and I don't even know if this is possible. I need to target window.location.href to an iframe on a different page. So, right now, the piece of the code that redirects the browser looks like this: Code: window.location.href='http://www.somewhere.com/'; Works great, brings it up in the same browser window. So now I need to modify the code so it goes to a different page and brings that page up in a specified iframe. I hope this makes sense. I really need help. And if it is not possible, I just need to know to abandon all hope. I have an HTML page that is making use of JQUERY and many other JQUERY plugins. Inside this HTML page there are 2 different types of iFrames that display PHP forms. One is a normal iFrame: Code: <iframe height="740" allowTransparency="true" frameborder="0" scrolling="auto" style="width:100%;border:none;overflow-x:hidden" src="https://www.website.com/machform/embed.php?id=9" title="Contact Us"><a href="https://www.website.com/machform/view.php?id=9" title="Contact Us">Contact Us</a></iframe> The other makes use of a JQUERY plugin called Shadowbox: Code: <a href="https://www.website.com/machform/embed.php?id=8" rel="shadowbox;width=1100;height=950;player=iframe" class="button1"><span></span><strong>Click Here</strong></a> Inside these iFrames are PHP forms from a PHP form application called MachForm, which is highly customizable. Here are the questions. Ultimately, I want to accomplish 2 things: 1. I would like to send variable information from the PHP form in the iFrame to my HTML page, to be displayed within javascripts. For example: If someone fills out a PHP form in my iFrame and clicks submit, I want to have a JQUERY popup say, "Thank you, [NAME]". 2. When the user submits the form, the action of clicking the submit button in the PHP form should enable #1, above. There needs to be a way to tell the HTML/Javascript that the submit button on the PHP form in the iFrame has been clicked. I realize this is all fairly vague, especially without the addition of more code. However, I am not even sure if I am posting this in the correct forum, since it incorporates a little of several languages and styles. From this point any direction or idea would be very helpful! Dear forum, I'm making a site for my g/f – She's writing angel messages for each day of the year, 1 message on 1 page and these (eventually 366 pages) are accessed from this one page: http://www.helderziendelezingen.be/w...per-datum.html This menu page uses JS to slide to particular months. The place I'm stuck is how could it be possible to go from a particular days message, back to the month of that message in the per-datum page (having the page slid to that month)... for clarities sake... “Terug” means “back”, so for example to click on october 22nd message, read the message, and terug back to Octobers seeds rather than back to the per datum pages month selection calender. My best effort so far is to put this in the a tag: onclick="document.getElementById('waarzegstermove').style.cssText='left: -1000px;';" -1000px would be Januarys terugs, -2000px Februarys terugs etc to have it already slid to that month, this code works when on the same page, but when its on the message page before loading up the per datum page it seems to lose this setting. I would really appreciate help on this – to be honest I've never used cookies, I dont know what they're for, am I on the right track, is there something else involved like location: hash? or is this what cookies are for? many thanks, Will Hi, I've got a drop down menu that works fine except I now want to add anchor links to it so that when one clicks on an option it updates the anchor in the url, however currently whenever i click on one it says 'undefined'. Any help would be appreciated. Thanks Code: function DropDown(el) {
this.dd = el;
this.placeholder = this.dd.children('span');
this.opts = this.dd.find('ul.dropdown > li');
this.val = '';
this.index = -1;
this.initEvents();
}
DropDown.prototype = {
initEvents : function() {
var obj = this;
obj.dd.on('click', function(event){
$(this).toggleClass('active');
return false;
});
obj.opts.on('click',function(){
var opt = $(this);
obj.val = opt.text();
obj.index = opt.index();
obj.placeholder.text(obj.val);
var anchors = opt.text();
window.location.hash = '#'.anchors;
});
},
getValue : function() {
return this.val;
},
getIndex : function() {
return this.index;
}
}
Hi there! I am pretty decent at PHP and HTML and I am slowly but surely learning Javascript, I don't really understand how Anchors work with Javascript though... If you would please help me out by pointing me in the right direction, I've seen on several occasions where Javascript will actually change text of a page depending on the selected Anchor, now I now how to make Javascript perform changes of things depending on their ids, but I do not know how it makes reference to an Anchor, could someone please be of some aid? I really appreciate it! Kind Regards Matthew Hello all, and thank you for your coments, I want to preserve a 16/9 aspect ratio to the window after any resize, making the width a function of the height. As I have a window.resizeTo() inside the window.onresize event function, the infinite loop is served. How may I quit it? Code: <html><head><title>Title</title><script languaje="javascript">
const c_ra=16/9;
window.onresize = function WindowReSize() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
// myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
// myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
}
myWidth = Math.floor(myHeight*c_ra);
window.resizeTo(myWidth,myHeight); // ** CAUTION resize event in a onresize event handler !
};
</script></head><body><p>Hello World</p></body></html>
i have this code i need to close the parent.html window when the child window opened, i need the code for that working well in IE and Firefox Parent.html <HTML> <SCRIPT TYPE="text/javascript"> function sendTo() { window.open('child.html','_blank','resizable=yes,width='+(screen.width-500)+',height='+(screen.height-500)+''); } </SCRIPT> <BODY > <form name="form"> <input type="text" value="" name="text1" id="pdetails1"> <input type="text" value="" name="text1" id="pdetails2"> </br> <input type="submit" value="submit" onClick="sendTo()"> </BODY> </HTML> child.html <html> <body> <form> <input type=text name="text5" value=""> <input type=submit name="submit"value="submit"> </form> </body> </html> |
|||||||