|
HTML - Complicated Iframe/anchors Question
right i have a site which is like a blog
the parent page has two iframes on it: one called date and one called blog now the iframe date has different dates in the iframe blog has well the blog with anchors on the dates now i need so that wen you click on a date in iframe date it moves to that anchor in iframe blog which are two completely different pages any help appreciated INDEX (base) <html> <head> <title>site sliced</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <!-- ImageReady Preload Script (site sliced.psd) --> <script type="text/javascript"> <!-- function newImage(arg) { if (document.images) { rslt = new Image(); rslt.src = arg; return rslt; } } function changeImages() { if (document.images && (preloadFlag == true)) { for (var i=0; i<changeImages.arguments.length; i+=2) { document[changeImages.arguments[i]].src = changeImages.arguments[i+1]; } } } var preloadFlag = false; function preloadImages() { if (document.images) { workinp_03_over = newImage("images/workinp_03-over.gif"); workinp_04_over = newImage("images/workinp_04-over.gif"); workinp_05_over = newImage("images/workinp_05-over.gif"); workinp_06_over = newImage("images/workinp_06-over.gif"); preloadFlag = true; } } // --> </script> <!-- End Preload Script --> <style type="text/css"> <!-- .style1 {color: #000000} --> </style> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" background="images/background.gif" onLoad="preloadImages();"> <!-- ImageReady Slices (site sliced.psd) --> <table id="Table_01" width="800" height="601" border="0" cellpadding="0" cellspacing="0" align="center"> <tr> <td colspan="14"> <img src="images/workinp_01.gif" width="800" height="21" alt=""></td> </tr> <tr> <td colspan="4"> <img src="images/workinp_02.gif" width="93" height="79" alt=""></td> <td colspan="2"> <a href="link1.html" onmouseover="changeImages('workinp_03', 'images/workinp_03-over.gif'); return true;" onmouseout="changeImages('workinp_03', 'images/workinp_03.gif'); return true;" onmousedown="changeImages('workinp_03', 'images/workinp_03-over.gif'); return true;" onmouseup="changeImages('workinp_03', 'images/workinp_03-over.gif'); return true;"> <img name="workinp_03" src="images/workinp_03.gif" width="132" height="79" border="0" alt="link1"></a></td> <td> <a href="link2.html" onmouseover="changeImages('workinp_04', 'images/workinp_04-over.gif'); return true;" onmouseout="changeImages('workinp_04', 'images/workinp_04.gif'); return true;" onmousedown="changeImages('workinp_04', 'images/workinp_04-over.gif'); return true;" onmouseup="changeImages('workinp_04', 'images/workinp_04-over.gif'); return true;"> <img name="workinp_04" src="images/workinp_04.gif" width="138" height="79" border="0" alt="link2"></a></td> <td colspan="2"> <a href="link3.html" onmouseover="changeImages('workinp_05', 'images/workinp_05-over.gif'); return true;" onmouseout="changeImages('workinp_05', 'images/workinp_05.gif'); return true;" onmousedown="changeImages('workinp_05', 'images/workinp_05-over.gif'); return true;" onmouseup="changeImages('workinp_05', 'images/workinp_05-over.gif'); return true;"> <img name="workinp_05" src="images/workinp_05.gif" width="162" height="79" border="0" alt="link3"></a></td> <td colspan="2"> <a href="link4.html" onmouseover="changeImages('workinp_06', 'images/workinp_06-over.gif'); return true;" onmouseout="changeImages('workinp_06', 'images/workinp_06.gif'); return true;" onmousedown="changeImages('workinp_06', 'images/workinp_06-over.gif'); return true;" onmouseup="changeImages('workinp_06', 'images/workinp_06-over.gif'); return true;"> <img name="workinp_06" src="images/workinp_06.gif" width="161" height="79" border="0" alt="link4"></a></td> <td colspan="3"> <img src="images/workinp_07.gif" width="114" height="79" alt=""></td> </tr> <tr> <td> <img src="images/workinp_08.gif" width="39" height="38" alt=""></td> <td colspan="2" rowspan="2"> <img src="images/workinp_09.gif" width="45" height="340" alt=""></td> <td colspan="9"> <img src="images/workinp_10.gif" width="624" height="38" alt=""></td> <td rowspan="2"> <img src="images/workinp_11.gif" width="50" height="340" alt=""></td> <td> <img src="images/workinp_12.gif" width="42" height="38" alt=""></td> </tr> <tr> <td> <img src="images/workinp_13.gif" width="39" height="302" alt=""></td> <td colspan="5" BACKGROUND="images/workinp_14.gif" width="329" height="302"> <iframe name="IF" id="IF" src="dates.html" height="100%" width="100%" frameborder="0">your browser doesnt support iframes please update it</iframe></td> <td colspan="4" BACKGROUND="images/workinp_15.gif" width="295" height="302" valign="top" style="padding-left: 25px"> <font color="white">HI HOW ARE YOU<P> this box doesnt extend and i cant make it so dont put too much here as it looks really screwy,<P> <B>but look at the background its acctually really smoothly animated and fades so it doesnt annoy you</B></font></td> <td> <img src="images/workinp_16.gif" width="42" height="302" alt=""></td> </tr> <tr> <td colspan="14" BACKGROUND="images/workinp_17.gif" width="800" style="padding-left: 100px; padding-right: 100px"><BR> <iframe src="blog.html" name="IF2" width="100%" height="100%" frameborder="0" class="style1" id="IF2">your browser doesnt support iframes please update it</iframe></td> </tr> <tr> <td colspan="14"> <img src="images/workinp_18.gif" width="800" height="107" alt=""></td> </tr> <tr> <td colspan="14"> <img src="images/workinp_19.gif" width="800" height="22" alt=""></td> </tr> <tr> <td colspan="14" BACKGROUND="images/mid_b.gif" width="800" style="padding-left: 105px; padding-right: 105px"><font color="white">and sodoesn this one <P> its great</font></td> </tr> <tr> <td colspan="2"> <img src="images/workinp_20.gif" width="75" height="17" alt=""></td> <td colspan="3"> <img src="images/workinp_21.gif" width="46" height="17" alt=""></td> <td colspan="5" rowspan="2"> <img src="images/workinp_22.gif" width="514" height="18" alt=""></td> <td colspan="2" rowspan="2"> <img src="images/workinp_23.gif" width="73" height="18" alt=""></td> <td colspan="2" rowspan="2"> <img src="images/workinp_24.gif" width="92" height="18" alt=""></td> </tr> <tr> <td colspan="5"> <img src="images/workinp_25.gif" width="121" height="1" alt=""></td> </tr> <tr> <td> <img src="images/spacer.gif" width="39" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="36" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="9" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="9" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="28" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="104" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="138" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="50" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="112" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="110" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="51" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="22" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="50" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="42" height="1" alt=""></td> </tr> </table> <!-- End ImageReady Slices --> <br> </body> </html> DATES: <html> <head> <title>doesnt matter</title> </head> <body bgcolor="black"> click a date to go to that date <a href"blog.html#10807 target="IF2">August 10th 2007</a></center> </font></body> </html> BLOG: <html> <head> <title>doesnt matter</title> <link href="blog.css" rel="stylesheet" type="text/css"> </head> <body bgcolor="black"> <table width="100%" border="3" align="center" cellpadding="5" cellspacing="5" bordercolor="#999999"> <tr> <td class="date" width="30%"><a name="10807">10th august 2007</a></td> <td class="main" width="100%">Hi my name is Matthew Hailwood and i decided to start a blog to keep track of my life, i dont know how often i will update this however I will try my best </td> </tr> <tr class="main"> <td class="date">10th august 2007 </td> <td>this is the second post </td> </tr> <tr class="main"> <td class="date">10th august 2007 </td> <td>this is the third post </td> </tr> </table> </body> </html> Similar TutorialsI want to use my images as links, but I also want them absolutely positioned relative to their parent div. However I have come across a problem, to make them links I need to wrap <a>s around them which then means their positioning becomes relative to the anchor tag. Can anyone suggest anything to counteract this problem? I do need them absolutely positioned. The only alternative is an image map, but I'm reluctant to do that because of the slow load time for the whole image, plus all the extra co-ordinate coding I'd have to do. I am currently undergoing construction on my website and had a quick (i hope) iframe question. I have a main page completed and a table in the center which loads the iframes. Currently, I have to create a new .html document for each iframe, which I was wondering, if I had somebody click on a link on the main page, a different iframe could load up for each link instead of a whole new .html page. edit this doesn't necessarily need to be in html, however I would prefer it to be so. Thanks Machtkampf Is there a way to have the iframe open with a 0 margin? for example... here, http://albertabrantes.com/peter/details.html I have a list of images, and I just point them directly to an iframe. But the iframe opens with a margin, and resizes the images... Is there a way to work around this? Thanks! It has been suggested that I Insert the form in a webpage by using an iframe: email: <IFRAME SRC="/cgi-bin/non-email-step20.pl" width="100%" height="430" SCROLLING="no" frameborder="0"></IFRAME> news: <IFRAME SRC="/cgi-bin/non-email-step21.pl" width="100%" height="400" SCROLLING="no" frameborder="0"></IFRAME> non-email step 20 and21 are perl scripts can some kind soul point me in the direction of how i inset these in a web page, or how to make a start thanks xstation hey guys cool and helpfull forum thx quick question for you gurus i have a html page with a iframe the content of the iframe is a catalogue. now if i use the include statement it changes page when you click add to cart or view order in an i frame it stay in the main page put it is only the content of the iframe that changes. but i get this ugly scroolbar from left to right top to button.. i understand the top to bottom but i want to get rid of the left to right..lol is there another way with the include?but it need to saty in the main page. thx guys how do i make it so the iframe NEVER scrolls.. it just extends to fit the content on the page? an example is http://xtinaweb.org/ - there's no scrollbar, you can just scroll down the page until the writing finished... Iv built a basic webpage, and in the center is an iframe that brings up the content that I want. However I want to include a flash control panel that is not in the iframe, but controls the navigation (in the iframe) when selected. Basically is it possible to have flash buttons controlling the content in an iframe, without the flash actually being included in the iframe. Thanx... Hi, I am creating a one page site that uses an iframe to display the other pages. So I create an index.html with an iframe in it and drawing an initial 'page': <iframe src="pages/welcome.php" name="carter-fairfax" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" width="900px" height="910px"></iframe> I then create another 'page' on the site and link to it using the following: <li><a href="pages/who-we-are.php" target="carter-fairfax" frameborder="0" scrolling="no" width="900px" height="500px">who we are</a></li> Everything displays fine except that there is a good deal of white space at the bottom, obviously because there is a difference in the height of the iframe - is there an elegant way to get round this problem. I do have the containing div height set to auto. Many thanks, Keith Hulse I have a page with many links. What I would like to do is have the links open a page on my site with the header info from my site, and the site outside my site in the iframe. This should be simple enough, I just dont know how to do it. So, the link will need to pass a var in some way to the "template" page with the url for the site outside my site, use it in the iframe etc. Any help? Ok i have a form that i would like to post data to an iframe from and i get it to work with the iframe on the page. but once i try to post to the iframe on a different page then the form is on my iframe doesn't show anything here is a sample of what i was using to get it to work all on the same page and i am trying to get the iframe to work on property-search-mls.php Code: <form id="searchForm" name="searchForm" target="iframe" action="http://www.mlsfinder.com/oh_cbr/streetsothebysrealty/index.cfm" method="post" onSubmit="document.getElementById('iframe').src='http://www.mlsfinder.com/oh_cbr/streetsothebysrealty/index.cfm';">
<input id="action" name="action" value="newsearchsession" type="hidden">
<input id="search" name="search" value=" Search for Properties" type="submit">
<iframe name="iframe" id="iframe" width="100%" height="800"></iframe>
if anyone can give me some insite on this i would be forever greatful i have spent a good part of today trying to get this to work thanks T hi, I have one question I have one index page <index.html> with iframe it displays: info.html, contact.html, and main.html it default src="main.html" if I creat a link from the other page eg. <hot.html> from <hot.html> I want to make a link just a single click it will go to <index.html> but in the iframe displays <info.html> instead of <main.html> how the codes should be like? Thanks. Before I begin, I'm new to these forums, and if someone can give me an answer, I plan to answer some of the more obvious questions around the forum. Alright, so I've searched for around 2 hours trying to find this. Everytime I try, I end up running into people asking the same question over and over again, "How do I create a link that changes the iframe's page?" That is not the question I am asking. Basically, I run a photoshop tutorial website, that I just started. I use an iframe, (named, "mainframe") and I know how to create links that change the iframe's contents. However, I want to submit some of my tutorials to other websites. The problem is that if I link to my website, the iframe loads the default page, and they have to navigate their way to the tutorial themselves, and that is not acceptable for those that actually need tutorials... I've found the temporary solution of copying the index.html file and then modifying the html code to set the default iframe page to the tutorial, then linking to the copied index file. However, I would rather just have one index file, and change the iframe page using a single U.R.L. To further simplify my question, I know it's going to look something similar to this: "http://psprofessor.orgfree.com/index.html?framepage=http://psprofessor.orgfree.com/images/tutorials/patterns/home.html" I know that this is not correct, and you need some sort of indicator as to what the name of the iframe is, I only showed that to show what type of question I'm asking. I also realise that the answer to my question may not include the word, "framepage." The url of the page with the iframe is: "http://psprofessor.orgfree.com/index.html" The url of the page I want to load into the iframe is: "http://psprofessor.orgfree.com/images/tutorials/patterns/home.html" The name of the iframe is: "mainframe" Basically I want to compress all that into a single url that I can type into my browser, and when I type it into my browser, I want to go to the index page and have the iframe named, "mainframe" load the tutorial page as opposed to the default iframe page. Thanks in advance to any assistance that I can get. Disregard this post Hello I am having trouble understanding destination anchors(xhtml transitional) First you do this right: <a name="pagetop"></a> then you do this <a href="#pagetop"> Page top </a> what I dont understand is how you mark the place in the site where you are suppose to jump to. It's seems I've come across a problem. When the page loads, I want it to go to the anchor. Do I have to use the "onload" Java command? Arrrg, - Miles Hi all, just a tiny little problem here. I've got an index page with roll-over thumbnail jpg pics. I want to link them to another page at the relevant place on the page. Currently I can manage a link to the page (storyboards.html), but I can't get the link to go down the page to the relevant section. (storyboard section2). Help appreciated. I'm trying to add an anchor to my blog, but without having any link to it in the page itself. I just want to be able to have a specific address for the part of the page that I want to jump to, so that I can cite that address in other places. Is there any way to do this? I tried inserting this in a random part of my page: <a href="#name"></a> And then this immediately above where I want the anchor to be: <A NAME="name"></A> But...going to mywebsite.com#name did not take me to the anchor, it just opened the page like normal. Ideas? I would like to use anchors to move down a long scrolling section of my page. The idea is like freezing the top of a spread-sheet. The top section is fixed and has a solid background and a high z-index. The bottom is similar to the top section. The middle shows the low z-index section and allows it to scroll. Since the top is currently set to a height of 200px, I need to have my anchors offset by 200px. I have this line of code showing in the top section: <a href="#line1">group 1</a>, <a href="#line2">group 2</a>, <a href="#line3">group 3</a>, <a href="#line4">group 4</a> Down in the code for the middle section I have code that looks like this: <a name="line1" id="line1">Group 1</a> repeated for four groups of text. The problem is that an anchor moves to the top of the browser window which is 200px above the area that is visible. Here are two links http://www.roberson-family.com/testing/scroll_test.html this is showing the problem. http://www.roberson-family.com/testi...ll_test_1.html and this is showing the cause of the problem. You can see that the underlying text aligns to the top of the browser. Surely there is a method to do this, but thus far, Google has failed me, and I find nothing like this here. trying to accomplish creating a drop down menu for the anchors of a page. any help or code would be greatly appreciated. any further details needed please dont be shy Example Drop Down-> Products Description->to anchored section. For multiple anchors. Thanks for your time. I am trying to link to a specific part of a page, the instructions tell me to: Quote: add # along with the destination anchor id to your href This is my href: Quote: Read the <a href="http://buzz.headlabsfirst.com title="Read all about caffeine on the buzz">Caffeine buzz</a> I have added in bold below <a id="#coffee"</a> so my mark up looks like Quote: Read the <a href="http://buzz.headlabsfirst.com <a id="#coffee"</a> title="Read all about caffeine on the buzz">Caffeine buzz</a> but it does not take me directly to the coffee section, what am I doing wrong please? |
|||||||