|
HTML - Hiding A Div Still Loads Content - Alternatives...
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?
Similar TutorialsI'm trying to set up an affiliate popup for my buddies and each time someone clicks a certain link, there will be a popup, but each time you click the link the content on the popup is different. I was wondering if this is possible. 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>]]> Hi 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. 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 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?? 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 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 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 Hi Not sure why, but IE hangs when loading my site. Could someone please take a look at the code - I'm using SWFObject to embed Flash, and am trying to build alternate HTML content: <!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> <title>Backlash - Rock n Roll Duo NSW AUSTRALIA</title> <meta name="Description" content="Backlash are the NSW premier Rock n Roll duo, for corporate and private functions"> <meta name="Keywords" content="Backlash, rock n roll, rock n' roll, wedding, dance, band, duo, Tom, Vanessa, CD, live, music, reception, corporate, song, songs, party, rcok, 60's, 70's, entertainment, Australia, backlash.com, backlash.net, www.backlash.com, www.backlash.net, www.backlash.com.au, www.backlash.net.au, singer, sing, vocalist, pop, drums, guitar, keyboards, bass, private functions, show, professional party band, professional party bands, party bands, corporate party bands, corporate party band, cover band, cover bands, Mick Jagger, Ron Woods, Keith Richards, rolling stones mp3, Brookwood Lounge, Pop Beat Blues, Dance, Elvis"> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script type="text/javascript" src="swfobject.js"></script> <script type="text/javascript" src="swfaddress.js"></script> <script type="text/javascript"> var flashvars = {}; var params = {}; params.quality = "best"; params.scale = "noscale"; params.allowfullscreen = "false"; var attributes = {}; attributes.id = "backlash"; swfobject.embedSWF("backlash.swf", "myAlternativeContent", "989", "590", "10.0.0", "expressInstall.swf", flashvars, params, attributes); </script> <link href="style.css" rel="stylesheet" type="text/css"/> </head> <body> <div id="flashvertical"> <div id="flashhoz"> <div id="myAlternativeContent"> <div id="background"> <div id="menu"> <?php include ("menu.php"); ?></div> <div id="content"> <div id="about"> <?php $content = file_get_contents($_SERVER['DOCUMENT_ROOT']."/about.txt"); echo htmlspecialchars($content); ?> </div> </div> </div> </div> </div> </div> </body> </html> /////////////////////// and here's the CSS: html{height:100%} html,body {margin:0;padding:0;} body{ background:#000000; text-align:center; min-width:650px; } h1 { font: 1px Verdana, Arial, Helvetica, sans-serif; text-align:left; color: #fff; } .maintext { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color:#fff; } #flashvertical{ position:absolute; top:50%; margin-top:-295px;/* half flash height*/ left:0; width:100%; } #flashhoz { width:989px;/* flash width*/ margin-left:auto; margin-right:auto; height:590px;/* flash height*/ background:#000; } h1 {color:#fff;margin:0;padding:0} #FlashDiv { width:989px; height:590px; //position:absolute; //left:50%; //top:50%; //margin-top:-295px; //margin-left:-494px; } #background { position:absolute; width:989px; height:590px; background-image:url(images/background_html.jpg); background-position:center; background-repeat:no-repeat; } #menu { height:375px; width:110px; margin-left:92px; margin-top:289px; float:left; } #content { height:260px; width:690px; margin-right:70px; margin-top:289px; background-color:#00FF00; float:right; } #about { height:100px; width:600px; margin-left: auto; margin-right:auto; margin-top:10px; background-color:#fff; } //////////////////////// Cheers Shaun Hi there, my pages are loading wide and then jumpimg down to the size the table is set to be. Does anyone know how i can specify the width of content either through css or the div tag? Thanks in advance! Hello! I hope that someone in this forum can help me solve the mystery that has been giving me a headache for two days now. I have a page that has a couple of iframes in it. when I view the page in firefox they show perfectly fine, however when viewed with IE one loads but the second one only shows a blank white page. They reside in a table, and are in a single row of that table. the code looks like this: <tr><td width="535" height="285" colspan="6" bgcolor="#FFFFFF"> <iframe frameborder="0" scrolling="auto" width="535" height="285" src="/members/updates.html"></iframe></td> <td width="5" height="285" bgcolor="#FFFFFF"> <img src="/members/graphics/spacer.gif" width="5" height="285" border="0"></td> <td colspan="2" background="/members/graphics/newsbg.jpg" width="240" height="285" alt="" border="0"><iframe frameborder="0" scrolling="auto" width="240" height="285" src="/members/news.html"></iframe></td> </tr> Is there some reaso that the second one isn't showing? I have two different pages that are designed like this. They look fine in firefox 1.5. IE gives me nothing. Hi, How in HTML can you force a webpage to scroll down to a certain point of the page when the page loads up. Is this possible in HTML. Once it does scroll down to the certain point, I still want to be able to scroll up and down AFTER it has loaded up...is this possible. Can someone please urgently help. Thanks hey guys...i've seen the page of sourceforge where, when the page loads...the download of the file generates automatically.... i want the help related to implement that.... can anyone tell me how to do that.... thanks in advance... Hi I have an html page that contains a .swf (index.html). I'd like to make sure that browsers always load the site, and not get it from their cache. I've heard of a thing called cache busting, but there is little info on it when dealing with anything other than a Wordpress site. Does anyone know about it or have info on any other way to make sure the site automatically loads directly? I don't want to have to rely on users manually clearing their cache. Cheers Shaun Need help determining why the below code will load on firefox but not internet explorer. fixed I don't know if this belongs here, because I'm not sure what I would do to do this, but here's my question: Is there any way I can make one webpage load if the IP the user is browsing from is in a certain range, and an alternate page if the user's IP is not part of that range? If so, how do I do this (this method is for a false block page that only appears from certain IPs to discourage folks from further attempting finding what is blocked. Sorta like a puzzleish thing instead of a traditional password - not to be secure, just for the fun of it.) Thank you in advance! How would I hide something and then when you click a link it shows it? Then when you click it again, it hides it, like a toggle? P.S. I want to hide/show this: HTML Code: <div class="js-kit-rating"></div> <script src="http://js-kit.com/ratings.js"></script> <div class="js-kit-comments"></div> <script src="http://js-kit.com/comments.js"></script> ~aeharding Hi, Im trying to make my footer content align correctly to the main content when a window resizes. The apdivs don't seem to want to move at all even with a relative position etc. I have tried everything but just cant get it to work can someone help please? http://pjm.co.uk.uksite4.yourwebserv...splay&PageID=5 Also some one commented before on the amount of css and JS pages. These will al be stripped out as its an Open sources system im using! Thansk alot Joe I'm hoping that there is a way to hide ads from spiders using HTML. Seeing as how my current host doesn't allow me to use Javascript. Hi, Is there a way I can not show all the url in the browser window. for instance when showing a links page, instead of the address being "http://www.webspace.co.uk/links.htm" could it just be "http://www.webspace.co.uk I have seen this done but not sure how. Thanks Simon |
|||||||