|
HTML - Frames/iframes Alternatives
I'm working on an application where the user will be able to build a page made up of several unrelated blocks of information. Since I'd like to generate some ad revenue from these pages, I'm concerned the disjointed nature of the information will tend to confuse ad networks (e.g. AdSense), leading to sub-optimal ads, fewer click-throughs, and less money.
It would be very easy for me to create each block of information as a separate page ("sub-page"), containing its own ad code, and then pull them (and their ads) all together in the user-created pages using frames or iframes. Based on my (limited) understanding of how the ad networks work, it seems this would enable better-targeted ads based on each of these sub-pages. If I'm right, the only problem is the frames and their associated headaches. 1. Am I making too much of the ad relevance issue? 2. Is there a non-frame solution that will achieve the same results? 3. Are the benefits of frames worth the problems? Thanks. Involute Similar TutorialsHi guys. I need some expert about an issue I'm having. Site: Zhentor Online The website content is loaded into an IFRAME (which you can see just below the advertisement box, below the part where it says "Zhentonian Time"). However, the website uses a dynamic IFRAME resizing script, which as you can guess, resizes the IFRAME to accomodate the contents, removing scrollbars. However, for this to work, the IFRAME needs to load twice. So you can imagine that can get a little annoying over time, having each page load twice... I load the contents into the IFRAME to prevent from loading the heavy graphics again and again. But I'm getting really annoyed with the double load issue, and would like an alternative, or a better script which only loads the IFRAME once. I'm looking for a scrollbar-free solution which is why I've neglected framesets. I also used another script a while back which loaded documents into a DIV but for some reason I was unable to submit forms through the DIV, which rendered it useless. JUST to make sure, the IFRAME I am concerned with is the 2nd bordered box from the top of the page. The first one holds advertisements, and the second one, which starts with the header "Zhentonian Time" is the IFRAME that loads all website content. If anyone has any ideas or suggestions please free to put them forward. A superior IFRAME resize script would be awesome, or any other way which might be suitable. Thank you. First, people were saying *frames* were bad for a lot of reasons... *then*...they were saying iframes were bad...for the same reasons! So..if frames and iframes are so bad, what is the alternative that has the same functionality as frames and iframes (parts of the screen can change *and* scroll, controlling one side with the other like a 'menu' on the left and 'contents' on the right which changes). hi there can anyone tell me how to put in a background color on iFrames ? am trying to call a particual site onto to a new html page but i want the new html page to have a different background color ? how do i do tht ? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "" > <html lang="en"> <head> <title>PokCosmo</title> <base href="http://www.pokecosmo.com/"> <meta name="keywords" content="pokemon, online pokemon, pokemon articles, netbattle tutorials, pokemon projects, pokemon forums, pokemon community, pokemon pokedex, battle competitor, netbattle, pokemon netbattle, pokemon art, pokemon fanart, pokemon diamond and pearl,free, pokemon ruby and saphire, pokemon emerald, pokemon ruby, pokemon saphire, pokemon cheat codes, pokemon hacks."> <meta name="robots" content="PokйCosmo Front Page 4.0"> <link rel="stylesheet" media="all" type="text/css" href="default.css"> <link rel="alternate stylesheet" type="text/css" media="all" title="style1" href="style1.css"> <link rel="alternate stylesheet" type="text/css" media="all" title="style2" href="style2.css"> <frameset rows="19.5%,80.5%"> <frame img border="0" src="column.html"> <frameset cols="15%,75%"> <frame src="framerow.html"> <frame src="column6.html"> </frameset> <noframes> <p>This frameset document contains:</p> <ul> <li><a href="#"><a href="www.pokecosmo.com"><img align="left"src="http://img152.imageshack.us/img152/5646/pokecosmosett2.png"></a> <a align="right" href="www.pokecosmo.com/pokegames"><img border="0" src="http://img523.imageshack.us/img523/7470/pokemongamesfz9.gif"></a> <a href="www.pokecosmo.com/projects"><img border="0"src="http://img511.imageshack.us/img511/6365/projectsjv5.gif"></a> <a href="www.pokecosmo.com/pokedex"><img border="0"src="http://img525.imageshack.us/img525/1631/pokedexqc0.gif"></a> <a href="www.pokecosmo.com/netbattle"><img border="0"src="http://img525.imageshack.us/img525/2083/netbattlemp1.gif"></a> <a href="www.pokecosmo.com/forums"><img border="0"src="http://img153.imageshack.us/img153/3989/forumsgc0.gif"></a></a></li> <li><a href="#"> <div id="left_side"> <div id="left_side_menus"> <img src="http://img238.imageshack.us/img238/3926/sitefv0.png"> <ul> <li><a href="contact" style="text-decoration:none">Contact</a></li> <li><a href="history" style="text-decoration:none">History</a></li> <li><a href="main" style="text-decoration:none">Main</a></li> </ul> <img src="http://img265.imageshack.us/img265/2431/projectsxy3.png"> <ul> <li><a href="pokemononline" style="text-decoration:none">POL RPG</a></li> <li><a href="netbattle" style="text-decoration:none">Competitor</a></li> <li><a href="graphics" style="text-decoration:none">Graphic Projects</a></li> </ul> <img src="http://img299.imageshack.us/img299/6435/downloadswk7.png"> <ul> <li><a href="downloadrpg" style="text-decoration:none">POL RPG</a></li> <li><a href="downloadnetbattle" style="text-decoration:none">Netbattle</a></li> </ul> <img src="http://img293.imageshack.us/img293/395/communityuo0.png"> <ul> <li><a href="forum/Login.php" style="text-decoration:none">Login</a></li> <li><a href="forum/register.php" style="text-decoration:none">Free Registration</a></li> <li><a href="forum/showthread.php?p=thread.php" style="text-decoration:none">Forum Rules</a></li> <li><a href="forum/reportabuse.php" style="text-decoration:none">Report Abuse</a></li> </ul></a></li> <li><a href="#"><meta name="robots" content="PokйCosmo Front Page 4.0"> <link rel="stylesheet" media="all" type="text/css" href="default.css"> <link rel="alternate stylesheet" type="text/css" media="all" title="style1" href="style1.css"> <link rel="alternate stylesheet" type="text/css" media="all" title="style2" href="style2.css"> <style type='text/css'> h1 {color: silver} h3 {color: black} </style> <img align="top" src="http://img340.imageshack.us/img340/3342/diamondandpearlcs3.png"><h1> Pokemon Diamond and Pearl- In stores Now!!!</h1> <img align="left" src="http://img249.imageshack.us/img249/953/diamondyr4.jpg"> <img align="right" src="http://img522.imageshack.us/img522/4228/pearlrd5.jpg"> <div align="bottom"><h4>PokйCosmo.com © 2007. All rights reserved.</h4> |<a align="bottom" href="http://www.pokecosmo.com">Home</a> | <a href="http://www.pokecosmo.com/forums">Forums</a> | <a href="netbattle">Pokemon Netbattle</a> | <a href="pokemonol>Online RPG</a> | <a href="pokedex">PokeDex</a> | <a href="contact">Contact Us</a> | <a href="affiliates">Affiliates</a>| <a href="copyright">Copyright</a>|<a href="content">Content rating</a>|</div> </div></a></li> </ul> </noframes> </frameset> <div id="footer"> <div>PokйCosmo.com © 2007. All rights reserved.</div> I am trying to pass some HTML code though XML but the browser is ignoring the HTML tags as oppose to turning them into HTML tags. In the example below, I want to create a link to Google with CData, but the browser outputs "<a href="http://www.google.ca/">Google</a>" as oppose to creating a link to Google. Code: <![CDATA[<a href="http://www.google.ca/">Google</a>]]> I think it was Pegasus who gave me this code for vertical alignment: Code: <div style="vertical-align: middle;"> But it doesn't work for what I'm tryin' to use it with.. I'm tryin' to vertically align some google adsense advertisements on an image. I got the ads to show up on the image correctly, thanks to the people here.. but I can't get'em to align vertically for some reason. Are there any alternatives for vertically aligning something?? I'm in the process of making a page where the menu/navigation is on the left, and to the right of it is the content area. I'm planning on using an iframe like I have in the past, so that the only place that reloads every time you click a menu option is the content area. The thing is, for the first time this website will have more content than my others, in which case a scroll bar would appear for just the content iframe ... is there any way around having this scroll bar appear? I would rather the height of the iframe just continue to extend as far down as the actual content goes, then stop. This way, the only scrollbar that appears on the webpage is the main scroll bar on the side of the browser. Is this possible with the iframe? if not, is there a better alternative?? please help!! EDIT: Edit: Okay, so I found a script that actually works but now I have another tiny problem. This is the code I found that works: http://www.milonic.com/mfa/2005-Apri...djustment.html But see on the javascript code it has a section that says "//extra height in px to add to iframe in FireFox 1.0+ browsers" ... this code actually does add extra unwanted space at the bottom of the iframe... extends it further than necessary. But I can't find the part where I can adjust/remove this? Could someone help me out with this?? I am trying to make my code more standards compliant and use the "strict" DTD. But when I try to validate using the W3C validator, there are a few things that I'm having trouble with. Target: I was using <a href target="blank" ....> to open some external links in a new window, but this isn't allowed in HTML 4 strict or XHTML 1 strict. What is supposed to be the replacement? The only thing I could find on a web search was a javascript, which I know little about. Is that the only alternative? (Seems a bit silly if it is, as this must be a commonly used feature.) Align: I used this to centre graphics, but this isn't allowed either. Are we supposed to set up different image classes in the CSS to allow centering, left, etc? br: Use of the <br> tag is allowed in HTML 4 strict, but there seem to be some paces where it isn't allowed. Does anyone have a reference to the rules for this? Thanks Heyas, I'm creating a project at the mo that needs a rather large number of tables. The whole project so far is CSS, but with the amount of data that needs to be displayed (with up to and beyond 150 on some pages) I think the div option is out as nesting them correctly would probably be a nightmare. On attempting to validate my html with a strict doctype, the only error I'm getting is that td width="###" isn't allowed. So is there any other alternative, or some other way to specify cell widths that will validate? Getting everything to validate properly was a bit heavy on the workload, and if possible I'd like to be able to stick with strict and not have to migrate to transitional. Also just to add that the tables are pretty simple. E.g. Table set one is 2 columns wide. Column 1 and column 2 stay the same width throughout an unlimited number of additional rows. E.g. Table set two is 5 columns, and once again, these width are constant throughout an unlimited number of rows. In short, is there any alternative to using td width that will validate as a strict doctype aside from creating and nesting 400 divs? Cheers, Mopy I've made a site (http://sketch.uk.com) that hides and displays divs according to the browser size. However, ideally I'd like to prevent the hidden divs loading their content until they are visible. A good example is the index page of the above link. There is an iframe for the flash animation that changes to a static picture when you resize to a smaller window. If you were to open the site on the smaller window (such as a tablet or mobile for example) it would be better that the iframe were never loaded at all. Any suggestions? I've heard many times "don't use frames, there is better ways to accomplish it", and I was wondering, is this just referring to "invisible" frames, or any frames? For example, look at Kingdom of Loathing. They use frames (or what appears to be frames) and I can't see how they could successfully make that site without. If I had to have all the screens scroll as one rather than separate, and couldn't resize when I needed to, it would be extremely annoying. So, frames are bad, or just the invisible ones? instead of doing frames i've put all my contents into an Iframe with 3 links underneth. Problem is, when you click a link it goes onto a different page, how do i make the link'ed contents appear in the iframe? I hope i make sense! Okay, here's the situation. 1) The client uses a catalog service that he likes and wants to keep, but hates the way their pages look. 2) Their Layouts aren't really customizable so I plop their info into another page using an iframe. This page is hosted on a different server than the content. 3) Annoyingly, iframes don't stretch to fit their contents, so if I set the height to accomdate all possible pages, I'm left with a silly amount of space at the bottom of most pages. I can't add code to the interior pages. I've looked around, but nothing seems to work. Any ideas? hi all... I am working with iframes on a website I am designing. My question is this... If users scroll all the way to the bottom of the page and click a link, how do you restore the index page all the way to the top, while loading the requested page within the iframe? Is there a way to make an iframe load all of a page, and make that its height? I don't want a scroll bar, but I would like it so the user can read the whole page in the frame. Is this possible? Thanks. Hi, I have a webpage which a friend of mine designed a long time ago. I'm not an HTML expert but I know the base things, and the problem is that my site don't use iframes, instead there are tables. I have many pages and the navigation links are on every single page. It's really a pain in the neck to change all pages to modify a navigation link. This is how the HTMl looks: Code: <body> <table width="800" border="0" cellpadding="0" cellspacing="0" class="main" align="center"> <tr><td colspan="2">Head image there</td></tr> <tr><td class="left"> <!--START OF NAVIGATION--> Navigation links are here <!--END OF NAVIGATION--> <td class="content"> <!--START OF CONTENT--> CONTENT HERE <!--END OF CONTENT--> </center></td></tr> <tr><td colspan="2" class="footer"> <!--START OF FOOTER--> This is the footer <!--END OF FOOTER--> </td></tr></table> </body> </html> A pictu Now my question would be that is it possible to put the navigation in a frame but keep the whole site layout the same? I mean, I would like to keep the scrolling the same - Have only 1 scrollbar and when scrolling, scroll the whole page, the navigation and the main content too. Thank you very much for any help! I used div aligns to put my Iframes where I want them and whenever I maximize the window it doesn't look like how it's supposed to. My friend doesn't have internet explorer, so is there some "universal" code I can use instead? Can anyone help? Thanks. Okay, well this is the raw website: http://www.shuushuubuttons.com/index2.html I have three iframes there...but when you bring the browser window in and out (using your mouse) the top frame gets eaten up by the bottom ones. Is there any way to 'lock' the top and left frame so it doesn't change size. I put in the 'noresize' tag, but that didn't seem to make any difference. Any help would be appreciated! Take a look at my html, maybe I've done the tags wrong. Thanks! Hi, this is my first post here. I uploaded my webpage http://inferno.comxa.com to the server of 000webhost.com When I tried to view them through various browsers, I found that the height attribute of the iframe tag was not responding in any browser except Chrome (12.0). I used the following browsers for checking: IE 8, Firefox 5.0, Opera 11, Chrome 12.0 This is my code Code: <body> <iframe src = "top-right.html" height = "23%" width = "15%"></iframe> <iframe src = "top.html" height = "23%" width = "83%"></iframe><br> <iframe src = "topics.html" height = "77%" width = "15%"></iframe> <iframe src = "home.html" height = "77%" width = "83%" name = "main"></iframe> </body> This is what I was able to see However when I ran a similar code on the editor of w3schools.com, it came out fine in all browsers. This is what I see in w3schools editor What is happening ? why such anomaly ? Help is appreciated. I also tried to replace the attributes of the iframe tag with CSS, but i found the same thing. Looks fine with Chrome but the height was not being registered with any other browser. This is my exact html code Code: <!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="default.css" />
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
</head>
<body style="height:100%;background-color:black;" >
<iframe src="" style="height:25%; width:15%;"></iframe>
<iframe src="" style="height:25%; width:83%;"></iframe><br>
<iframe src="" style="height:75%; width:15%;"></iframe>
<iframe src="" style="height:75%; width:83%;" name = "main"></iframe>
</body>
</html>
and this is my stylesheet Code: *{background-color:black;color:white;}
html{background-color:black;color:white;}
h1{font-size:250%;text-align:center;color:yellow;background-color:black;}
h2{font-size:175%;text-align:left;background-color:black;color:white;}
body{background-color:black;color:white;font-size:120%;}
p:first-letter{font-size:150%;color:red;background-color:black;}
a:link{color:blue;background-color:black;}
a:visited{color:blue;background-color:black;}
a:hover{color:yellow;background-color:black;}
a:active{color:white;background-color:black;}
this is what I saw in IE8 http://html.net/forums/download/file.php?id=55 By the way, in IE8 i get a white space in the frames whereas in Firefox/Chrome/Opera , it comes out black. Anything with CSS compatibility? |
|||||||