View Full Version : change iframe content and parent window content from single click in iframe window

04-28-2017, 04:33 PM
I have an iframe on a page with a series of <A id="#1"><A id="#2"> etc, i'd like to make one of them also change the content in the parent window at the same time, in just one click. in other words, window.top.location.href and id="#2" in one link statement. the top window would change at the same time as the id="2#". is that possible? i know with the old html frames,you could load different html pages in different frames of the page with one click, which was incredibly useful, but i'm not finding a similar script for iframes.

wait, i'm not thinking about this correctly, if parent window changes, iframe would also change if not included (and even if included i need a way to pass the id series inside the iframe <a id=#whatever" to the new (yet same, iframe). so if i include iframe on parent window that has changed, ......
ugh. okay, with the old method of jumping to anchor links in/out of page, you could append the #whatever to the end the address. like blahblahpage.html#whatever. they messed all that up with their html5 changes.

i'm guessing the only way to resolve this is to window.top with the single click and just have the iframe on the new window.top loaded with the new id already in it.
sorry about the mess. you can skip this crazy confused question

04-29-2017, 03:34 AM
This actually can be done. I would use a query string attached to the url. That could be read by a script on the new top page and give an indication, or the entire url to be loaded into the iframe on the new top page. But same origin restrictions might apply. Probably not though. But sites/pages that don't allow themselves to be loaded into frame/iframe would cause this scheme not to work as desired.

04-29-2017, 04:00 AM
Here's a demo - the from page (call it anything you want):

<!DOCTYPE html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<a href="loadintoiframe.htm?url=http%3A%2F%2Fwww.dynamicdrive.com%2F">A Page with DD in an iFrame</a>

The page that will perform this "miracle" (in this example, it should be saved as "loadintoiframe.htm"):

<!DOCTYPE html>
<title>Load Into iFrame</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<iframe name="targetframe" src="about:blank" width="300" height="300" scrolling="auto" frameborder="1"></iframe>
var s = window.location.search, i, q;
s = s.split(/[\?&]/); i = s.length;
while(--i > -1){
q = s[i].split('=');
if(q[0] === 'url'){

Though tested and works, it's just a rough idea off the top of my head from stuff I've seen before. Any questions, just let me know.

04-29-2017, 08:39 PM
If I understand the question well, then this (mesdomaines.nu/eendracht/location_search2) would also be possible.
Same origin restrictions don't apply.

04-30-2017, 12:08 AM
wow thanks guys.
i am trying to simulate a japanese roleplaying game style , featuring a turn-based battle system, in a regular html page using an iframe for messages such as "you were hit for 1 pt of damage' or "the enemy was hit for 1 pt of damage" , etc. i was trying to keep as many of the events of the battle on the same page to avoid the screen flashes that result from changing html pages. as it turned out, i still had to change html pages twice during just the first round of battle. le mew, le sigh.

04-30-2017, 12:22 AM
note: trying to simulate random events and score keeping with html, css and javascript, is no easy task. i'm not using a game engine for this. i'm attempting to make the entire thing with just freely available bits of random genius of other coders, like mr. jscheuer1. one thing i did was find a random page generator, which on button click, picks whether the attack hits, crits or misses by loading the randomly picked corresponding page for hit, crit or miss.. then i have to change graphic used for the health of the player and the health of the monster, manually and the corresponding animations for the attacks, each time. since there are 3 possible attack types, and each of those has 3 randomly generated possibilities (hit, crit or miss), i will end up making hundreds of pages, for just one battle. lol i'm sure there's an easier way but i am not a coder. when i look at javascript codes, particularly complex ones, it all just reads like a foreign language i don't understand.

04-30-2017, 02:58 AM
Do you have a specific question? In any case, if there are only three possible outcomes, you should only need three pages, at least for the outcomes.

04-30-2017, 04:22 AM
Do you have a specific question? In any case, if there are only three possible outcomes, you should only need three pages, at least for the outcomes.

even the question is hard to decide how best to ask it. if there are 3 attack types (one ranged melee, two magic based) and each of those can be either a hit,miss or crit, and the player can also heal their own character, how do i keep track of all that? my theory was that i would have to make at least two pages for each attack round (player attacks, monster attacks), one for each attack type (ranged melee, magic 1 and magic 2) and for each random event (hit, crit or miss) and do so for each pt of health the monster had and lost and for each pt of health the player had and lost and also healed. it starts to add up. because html is so linear, and i don't incorporate a data storage technique, each event has to be done manually. in effect, every possible combination of the three attack types + heal, would have to have a page generated for it, encompassing potentially, at the very least, 20 rounds (and that's being generous since some of those rounds will be random misses and some will be heals. and its only 20 rounds if the player's character landed a critical attack 20 times in a row lol....not gonna happen with a random page script with only 3 possible choices, all three of which have the same chance of rolling . critical attack does twice as much damage as normal hit. )

it's boggling my brain. i managed to make the first round (player attacks + animation, monster attacks + animation, changed health bar graphics to indicate damage done to player health and monster health, and return for second round. now if the player pushes the same button, i have to generate a page in advance for that potentiality, if they push a different button i have to make a page for that in advance, and i have to make the page that shows either a hit miss or crit. i also have to make pages where they don't push attack at all and instead just heal themselves over and over lol doh. thats like......i'm boggled.

i realize some things are re-usable, such as the ranged melee hit, crit or miss pages, the magic 1 hit crit and miss and the magic 2 hit crit or miss, the animations themselves, once created are re-usable, but i still have to make the html page that will hold and depict the event - the attack animations, the heal animation, the health bar status changes,if any, each time an attack or heal transpires which is almost totally out of my control. the person playing the game by pressing the buttons is making the bulk of the choices. i can't even calculate how many individual html pages would be necessary to render all of that in a game like way so that any potential button choices made and random events, would have a corresponding page to support it.

04-30-2017, 06:37 PM
i've counted up how many potential pages had to be made for first round:
1. melee attack hit
2. melee attack crit
3. melee attack miss
4. magic 1 hit
5. magic 1 crit
6. magic 1 miss
7. magic 2 hit
8. magic 2 crit
9. magic 2 miss
10. heal
11. page to hold player attack
12. page to hold monster attack
13. page to hold beginning of battle
14. page to hold beginning of next round.
15. page showing results for player char attack
16. page showing results for monster attack

once the initial crits hits and misses for each attack type is created and the heal, they can be reused. so 6 new pages each round.
multiply that by, at the very least 20 (extremely unlikely) and most likely over 35. that's how many individual pages i have to make to simulate one
turn based battle, from beginning to end, in a browser window with nothing but html, css, a javascript random page generator, and a javascript auto page
changer on a set timer delay. i don't mind making the pages and i realize some of them are reusable. what makes the amount of pages needed so high
is that all the randomness is being simulated by each potential event being pre-generated by yours truly, beforehand. i have to simulate all possible combinations of
button choices for 35-ish battle rounds. thats like 210 pages or thereabouts lol (and probably alot more)

note: i've made it easier on myself by making the amount of damage be the same, regardless of attack type. so magic 1 will do same damage as melee attack or magic 2. etc the only variable is if its crit or hit or miss, i'm considering removing "miss" from the variables because it'll make the damage calculations tidier.

05-01-2017, 05:28 PM
If you start now and code four pages a day you'll easily be finished by early July. Good luck with the project.

05-01-2017, 06:56 PM
If you start now and code four pages a day you'll easily be finished by early July. Good luck with the project.

hehe ty :D

i just finished making the animatiions for heal, bow, magic 1 and magic 2. now working on sounds. it's easy to get messed up in coding. it's like a maze. i wanted to show that you can make a game without a game engine, for the artists and whatnot, who are not natural coders but really want to make a game. i can't afford photoshop, after effects, 3ds max, etc. so i'm doing most of this work with free stuff or really old software i bought years ago. hopefully the codes are either, mit licensed and/or properly credited. it's just a matter of patience and the genius of other coders that makes it possible. my code is a mess but it works......so far. :D real coders would take one look at my mess of codes and laugh. i have javascript mixed with html in the same statement (supposedly a big no-no), styles all in the head, rarely have a separate style sheet, never condensed into one large style statement. tons of inline styling. oopsie. no controls for sounds/music (i gotta fix that) -- it just plays whether you want it to or not. duplicate listings of multiple jquery files. not quite media query friendly yet, either. pretty much responsive in size / width just well... character supposed to be standing on floor ends up standing 2 inches from ceiling in iphone 5.

i'm just an old, handicap retiree who loves rpgs and video games, generally speaking. lots of free time and an abiding interest in gaming