HTML - Why Isnt This Working
HTML Code:
<html> <head> <title> My First Script </title> <style type="text/css"> .highlight { color: red } </style> <script type="text/JavaScript"> function showBrowserType() { document.getElementById("readout").innerHtml = "your browser says it is: " + "<span class='highlight'>" + navigator.userAgent + "</span>.hr />"; } window.onloadd = showBrowserType; </script> </head> <body> <h1> Let's Script. . . </h1> <hr> <h1> Let's Script. . . </h1> <hr /> <div id="readout"></div> </body> </html> Similar TutorialsNEW PROBLEM: Look down at last post. A link at the top of my site is bieng bumped down a line for no reason. Why, and how do i fix it? (Note: It only happens in IE, not FireFox, or Opera) Well, heres the code: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Lithium Games Home</title> <meta http-equiv="Games and Applications" content="text/html; charset=iso-8859-1"> <style type="text/css"> * { margin:0; padding:0; } body { BACKGROUND-IMAGE: url(http://img410.imageshack.us/img410/1112/backwh0.jpg) } #container img { display:block; border:0; margin:auto; clear:both; } #logo { padding-bottom:5px; padding-top:3px; } #nav { width:194px; height:32px; margin:4px auto; list-style-type:none; } #nav li { margin:0 2px; float:left; display:inline; } #nav img { float:left; } #footer { position:absolute; width:100%; bottom:0; text-align:center; } </style> </head> <body> <div id="container"> <CENTER> <img id="logo" src="http://img136.imageshack.us/img136/9871/lglogoso1.gif" alt="Lithium Games Logo"> <img src="http://img165.imageshack.us/img165/8732/linesur6.gif" alt=""> <ul id="nav"> <p> <li><a href="http://lithium-games.com/"><img src="http://img165.imageshack.us/img165/9886/homebuttonjd7.gif" alt="Lithium Games Home"></a></li> <li><a href="/Games/sixteen.html"><img src="http://img165.imageshack.us/img165/3537/gamesbuttonkh2.gif" alt="Download Games"></a></li> <li><a href="http://imageshack.us"><img src="http://img136.imageshack.us/img136/9639/appsbuttonuv9.gif" alt="Download Applications"></a></li> </ul> <img src="http://img165.imageshack.us/img165/8732/linesur6.gif" alt=""> </div> </p> </CENTER> </div> <br /> <p style="text-align: center;"> <FONT SIZE=5 COLOR="white"><u> Lithium Games</u> </FONT SIZE></p> <br /> <p style="text-align: center;"> <FONT SIZE=3 COLOR="white"> Lithium Games is a small, yet growing software development company. <br /> We mainly focus on producing games, but we make various computer applications as well. <br /> We strive to provide nothing but the utmost quality in our programs. <br /> <img src="http://img165.imageshack.us/img165/8732/linesur6.gif" alt=""> </FONT SIZE></p> <br /> <p style="text-align: center;"> <FONT SIZE=5 COLOR="white"><u> Lithium News:</u> </FONT SIZE></p> <div id="footer"> ©Lithium Games, 2008 All Rights Reserved</div> </body> </html> Help, im really stuck... Ive managed to compose a cool HTML5 menu, that works beautifully in Chrome and Safari. It falls back nicely in IE9 and FF.... but IE8 .... clueless.. 2 problems: 1 -> Menu doesnt load correctly (see screenshot below) 2 -> The text div is being faded along with the background.... (see screenshot below) Both errors only take place in IE8.. Could someone point me in the right direction? Very, merry, much obliged. Thanks! source: X screenshot IE8: http://img442.imageshack.us/img442/1842/tancr.png I''m trying to center the main title of the page: Combative Conditioning $50 per month http://lmiinc.com/combat_conditioning.html It seems to be off to the right a lot... But I have it text-align: center; Any ideas? Thanks. This banner was working normally at one point, showing up & linking to the proper website when you clicked on it. But now it doesnt show up on regular computers & only on mobile phones from time to time? <A href="http://www.myspace.com/PunkRockPrincess.com"><IMG src=]http://i634.photobucket.com/albums/uu61/PunkRockPrincesscom/prp_glow_light.jpg" style="visibility: visible ! important; display: block ! important;"/></A><BR/> Can anyone see why its not working properly? I'm stuck. Thanks. Could anyone tell me how I get around my code not being strict when I use flash on my site? I've got this site www.livingwordchurch.org.uk/new.html and it's not strict for several reason but many of them being the flash file inserted in the header. How can I deal with this? Hey, im trying to find out why the header on my website isnt at the top of the page. it also moves sometimes even though the code appears to be all the same. the address is www.themonsterbox.com thanks in advance for any help. i have installed IIS 5.1 in my XP machine but when i type http://localhost it shows a blank page. Hi Guys, I have this link: <a href="programs/XMLPoster.exe">programs/XMLPoster.exe</a> It works when i view it in Firefox, but gives me an error when i click it in i.e? Do you know why this is happening? Ideally i want to be able to launch the .exe file and not just ask the user if they want to save it? Thanks, Chloe ~X~ I'm new to this forum and was not quite sure where to post this but I am having some trouble putting this code I made into my myspace and making it work. It shows up correctly on the normal browser but when I go to add it to my page it doesn't work. Any help would be appreciated. HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN"> <html> <head> <style type="text/css"> #picturebox { background: #transparent; background-image:url('http://img231.imageshack.us/img231/6485/tvphotosmallergs4.jpg'); background-repeat: no-repeat; position: absolute; top: 0px; left: 0px; width: 800px; height: 631px; } #moviebox { background: #FFFFFF; background-repeat: no-repeat; position: absolute; top: 120px; left: 168px; width: 400px; height: 300px; } </style> </head> <body> <div id="picturebox"> <div id="moviebox"> <object type="application/x-shockwave-flash" width="400" height="300" data="http://www.vimeo.com/moogaloop.swf?clip_id=721534&server=www.vimeo.com&fullscreen=1&show_title=1&show_byline=1&show_portrait=0&color="> <param name="quality" value="best" /> <param name="allowfullscreen" value="true" /> <param name="scale" value="showAll" /> <param name="movie" value="http://www.vimeo.com/moogaloop.swf?clip_id=721534&server=www.vimeo.com&fullscreen=1&show_title=1&show_byline=1&show_portrait=0&color=" /></object> </div> </div> </body> </html> Thank you! Hi guys, For some reason, in IE8, on product pages (Example) of my ecommerce site, the 'Size Chart' and 'Email to a Friend' popups don't work, and the product image lightbox won't work either. I have turned pop-up blocker off but they still don't work. These popups work in every other browser I have tested in, including IE7. It seems to only be IE8 that is having this problem. Upon looking at the page source, one thing I have noticed that both the 'Size Chart' and 'Email to a Friend' buttons have in common, is that the popups seem (I'm far from an expert) to be 'triggered' by a span element (class="more") within the HTML. For example: Code: <div class="row "> <label >Size: </label> <strong class="fl"><select name="size" id="size" onchange="checkstock(this.value)"><option value="">Select Size</option><option value="S">S</option><option value="M">M</option><option value="L">L</option><option value="XL">XL</option><option value="XXL">XXL</option></select></strong> <span style="text-decoration: underline;" class="size_chart more" title="size_chart1">+ Size Chart</span> <div style="display: none;" class="size_chart1 hide" > <div class="close"></div> <img src="http://www.projectdisobey.com/disobeyclothing/wp-content/themes/eCommerce3/images/size_chart.jpg" alt="" /> </div> <!-- size chart --> </div> Code: <ul class="fav_link"> <li class="print"><a href="#" onclick="window.print();return false;">Print</a> </li> <li class="rss"><a href="http://feeds.feedburner.com/DisobeyClothing">RSS</a> </li> <li class="emailtofriend"><span style="text-decoration: underline;" class="more" title="tellafrnd_div">Email to a Friend</span> </li> <li class="blank"><span id="tellafrnd_success_msg_span"></span></li> <li class="blank"><div style="display: none;" id="tellfrnddiv" class="tellafrnd_div hide"> <iframe src="http://www.projectdisobey.com/disobeyclothing/?page=tellafriend_form&pid=402" style="border: medium none ; width: 547px; height: 558px;" frameborder="0" ></iframe> </div> </li> <li class="share"> <div class="a2a_kit addtoany_list"><a class="a2a_dd addtoany_share_save" href="http://www.addtoany.com/share_save"><img src="http://www.projectdisobey.com/disobeyclothing/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/></a></div> <script type="text/javascript"><!-- var a2a_config = a2a_config || {}; a2a_config.linkname="Know Your Enemy"; a2a_config.linkurl="http://www.projectdisobey.com/disobeyclothing/?p=402"; a2a_config.color_main = "f3f3e7";a2a_config.color_border = "C0C88A";a2a_config.color_link_text = "332402";a2a_config.color_link_text_hover = "332402";a2a_config.color_bg = "7f6f2"; a2a_config.num_services = 14; //--></script><script type="text/javascript" src="http://static.addtoany.com/menu/page.js"></script> </li> </ul> I have no idea what could be stopping the lightbox from working. Anybody have any suggestions as to what the problem might be (and how I can rectify it)? If you need more info, let me know... Thanks! I've found a website that shows my Steam status every amount of time, just like the rest of other websites. This banner or gamecard should show if i'm online, what i'm playing and other stuff that is in the gamecard. The website has an option for yourself to put your own PNG image as the card's background. I entered the link correctly of the image and after that it gave me the codes to put them wherever i want. The problem is that when i submit the code wherever i want (Forums) the image doesnt show but the code in text itself. The PNG had transparent parts so i tried on a pure black background, didnt work either. Then i noticed the code has some different values/elements from the included images that the website comes with. This is the code of my custom PNG image: Code: http://steamsigs.com/steam.php?id=ik....png&tborder=1 And this is with the default image of the website: Code: http://steamsigs.com/steam.php?id=ik...rmal&tborder=1 I also tried different text borders and options. You can try yourself doing the gamecard he www.steamsigs.com You will need a custom Steam ID url, but you can use mine: ikamikaze15 And if it could be something wrong with the image, here it is: http://i1000.photobucket.com/albums/...ndoGR15/ua.png Thanks for helping. Hey all I have just joined these forums as I am learning HTML and CSS. However the book that I am following does not appear to be working. I have created a custom class in css called "Stewart" and a test page to test it however it does not appear as I have defined. Below is the code for the CSS page Quote: <!-- A CSS style sheet --> body { font-size: 10pt; font-family: Arial; color: black; line-height: 14pt; padding-left: 5pt; padding-right: 5pt; padding-top: 5pt; } h1 { <!-- ALso possible to define different classes see SAM's teach yourself HTML and CSS p59 --> background-color: pink; font-size: 14pt; font-family: Arial; font-weight: 20pt; color: red; } h2 { font-size: 12pt; font-family: Arial; font-weight: 20pt; color: red; } h3.silly {font: 36pt Comic Sans; } h3.serious {font: 8pt Arial; } p.subheader { font-weight: bold; color: green; } <!-- Custom Class, use the div heading to create a custom class --> DIV.stewart {font-size: 30pt; color: red; font-style: italic; } And here is the code for the test page Quote: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <link rel="stylesheet" type="text/css" href="styles.css" /> <!--The above is a link to the css file in this directory --> <title>CSS Test sheet</title> </head> <body> <h1> This is a test sheet for my css, it might possibly look different every time. </h1> <h3 class="silly"> Silly</h3> <p> The above text is silly class of heading 3</p> <h3 class="serious">serious</h3> <p> The above text is serious class of heading 3 </P> <p> <div class="stewart">This is my own custom style</div> </p> </body> </html> Can someone please explain where I am going wrong. I am using IE on WIndows 7. Hi, I'm a self-taught web designer with not a lot of experience and need some help please! This website shows up perfectly in Chrome + Firefox, but it completely fails in IE. http://fparchitectural.ca/beta/ I'm guessing it's a css/div issue. Hopefully it is a simple fix. Please Help. I have a code for div and the strange thing is that it is working in empty html code but if i put it in an existing html code then it will not work! please help!!! So this is the website that I got: Quote: http://eksow.com/ This is the source code for it: Quote: <!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" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Eksow Event Design & Management</title> <link rel="stylesheet" type="text/css" href="style.css" /> <script type="text/javascript"> function showPictures(n) { obj = document.getElementById('changingPictures'); document.getElementById('bottom').style.top = "0px"; if(n==1) { obj.src="http://eksow.com/images/Eksow_07.jpg"; obj.style.visibility="visible"; } else if(n==2) { obj.src="http://eksow.com/images/Eksow_13_07.jpg";//Change this value to the url of second set of images obj.style.visibility="visible"; } else if(n==3) { obj.src="http://eksow.com/images/Eksow_12_07.jpg";//Change this value to the url of third set of images obj.style.visibility="visible"; } else{} } </script> <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script> </head> <body> <div id="container"><img src="http://eksow.com/images/Eksow_01.jpg" width="1024" height="261" alt=""> <div id="left" class="rollImages" onclick="showPictures('1')"></div> <div id="middle" class="rollImages" onclick="showPictures('2')"></div> <div id="right" class="rollImages" onclick="showPictures('3');"></div> <img src="http://eksow.com/images/Eksow_07.jpg" alt="Home Page" id="changingPictures"/> <div id="bottom"></div></div> </body> </html> This is the CSS of it: Quote: body { background-color:#000000; width:100%; padding:0px; margin:0px; margin-bottom:10px; } #container { margin:0px auto; width:1024px; padding:0px; text-align:center; } img { border-width:0px; padding:0px; margin:0px; } #left { background-image:url(http://eksow.com/images/Eksow_03.jpg); margin-left:74px; } #left:hover { background-image:url(http://eksow.com/images/Rollover_1_03.jpg); } #middle { background-image:url(http://eksow.com/images/Eksow_04.jpg); width:296px; } #middle:hover { background-image:url(http://eksow.com/images/Rollover_2_04.jpg); } #right { background-image:url(http://eksow.com/images/Eksow_05.jpg); position:relative; } #right:hover { background-image:url(http://eksow.com/images/Rollover_3_05.jpg); } .rollImages { width:292px; height:229px; float:left; cursor:pointer; } #changingPictures { visibility:hidden; } #bottom { height:8px; background-color:red; text-align:center; background-image:url(http://eksow.com/images/Eksow_08.jpg); position:relative; left:50px; top:-260px; } #bottom:hover { background-image:url(http://eksow.com/images/Rollover_4_08.jpg); height:8px; } What I'm trying to do is insert Quote: http://eksow.com/eksow.swf Which is Flash (160x15 px) into the actual website RIGHT UNDERNEATH the 'bottom'. I've tried, and tried, and tried again... But nothing works :S Does anyone know if there is some trick that I have to do or I'm overlooking something? Im not really in the mood of screwing it up, you know? I'm completely new to HTML(Day 2 of learning), so please excuse my lack of knowledge. I've been trying to create some text that would become invisible and different text would become visible when a name was moved over, and I can't seem to get the visible attribute to work. For example: <font visible=false>some text</font> I would assume the text would become invisible, but it doesn't appear so. So, I'm wondering if there's a tag that has a text attribute to make this work? Like: <tag id=name text="some text"/> So I can then call, name.text="", to make the text disappear. Any suggestions? Hi all, Just wondering if someone may shed some light on why SSI would work for my php pages but not my HTML ones? .htaccess root/include (I don't want to be setting this type of access across the site so it sits at the .shtml location): Options +Includes AddHandler server-parsed .shtml PHP (works): <?php include("../include/copyright.shtml"); ?> HTML (fails): <!--#include virtual="../include/copyright.shtml"--> Trying to load the HTML file with the include will through the following error: [an error occurred while processing this directive] Here is the layout: PHP: root/common/myPage.php HTML: root/common/myPage.html SSI: root/include/copyright.shtml If I move the copyright.shtml to the root location or put it in the same location as the files I'm trying to serve the include to, it works fine. Obviously with the site structure you want to keep all your .shtml files together so having them all stored in a common area is far more practical. Just not sure why HTML is having such a problem targeting a dir! Any help would be greatly appreciated. Thanks all! Cheers, Nick. I have the following code, and it only works in Internet Explorer and Netscape, but I need it to work with those and firefox and opera. HTML Code: <style> body {background: #555555; font-family: arial; margin: 20;} table.body {width: 85%; height: 100%;} td.body {background: #fcfcfc;} table.nav {width: 200; border-top: 1px solid black; border-right: 1px solid black; border-left: 1px solid black;} td.navbuttonhead {background: url(assets/images/structure/fadebar.png); border-bottom: 1px solid #191919; color: white;} td.navbuttonoff {background: #6a6a6a; border-bottom: 1px solid #191919; border-top: 1px solid #8A8A8A;} td.navbuttonon {background: #8C8C8C; border-bottom: 1px solid #191919; border-top: 1px solid #8A8A8A;} td.navbuttonofftop {background: #6a6a6a; border-bottom: 1px solid #191919;} td.navbuttonontop {background: #8C8C8C; border-bottom: 1px solid #191919;} td.bodyleft {width: 12; background: url(assets/images/structure/bodybgleft.png); border-right: 1px solid black;} td.bodyright {width: 12; background: url(assets/images/structure/bodybgright.png); border-left: 1px solid black;} a.navbutton {text-decoration: none; color: white;} img {border: none;} a.link {color: #404040; text-decoration: none;} a.link:hover {color: #404040; text-decoration: underline;} </style> <table class="nav" cellspacing="0" cellpadding="2" style="margin-bottom: 4;" id="tableCollapsed1" style="display: none;"> <tr> <td class="navbuttonhead"> <a href="#" class="navbutton" onclick="collapse(1)"><div>Test</div></a> </td> </tr> </table> <table class="nav" cellspacing="0" cellpadding="2" style="margin-bottom: 4;" id="tableExpanded1"> <tr> <td class="navbuttonhead"> <a href="#" class="navbutton" onclick="expand(1)"><div>Test</div></a> </td> </tr> <tr> <td class="navbuttonofftop" onmouseover="className='navbuttonontop'" onmouseout="className='navbuttonofftop'"> <a href="#" class="navbutton"><div style="padding-left: 2;">Text</div></a> </td> </tr> <tr> <td class="navbuttonoff" onmouseover="className='navbuttonon'" onmouseout="className='navbuttonoff'"> <a href="#" class="navbutton"><div style="padding-left: 2;">Text</div></a> </td> </tr> <tr> <td class="navbuttonoff" onmouseover="className='navbuttonon'" onmouseout="className='navbuttonoff'"> <a href="#" class="navbutton"><div style="padding-left: 2;">Text</div></a> </td> </tr> </table> <script type="text/javascript"> function expand(id) { document.getElementById("tableCollapsed" + id).style.display="none"; document.getElementById("tableExpanded" + id).style.display="block"; } function collapse(id) { document.getElementById("tableExpanded" + id).style.display="none"; document.getElementById("tableCollapsed" + id).style.display="block"; } </script> Any help would be nice. hi, i have a problem with my javascript---i have an image changer, and when you click on the name of the image it changes the image and the link to view the full size image. in firefox and chrome, this works fine, but in IE it displays only the URL for the image on click. the website is http://sc-lee.com/art.html , to view/test, and the code is: Code: <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link href="branch2.css" rel="stylesheet" type="text/css" /> <script> var thelink = 'http://sc-lee.com/art/2l.jpg'; </script> </head> <body> <div id="navss"><B>OTHER WORK</B> <a href="art.html">paintings & drawings</a> / <a href="collage.html">collage</a> / <a href="graphics.html">graphics</a> </div> <div id="back"><a href="javascript: history.go(-1)">< back</a></div> <div id="contenta"> <img src=art.gif /> <br> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/2.jpg'; var thelink = 'http://sc-lee.com/art/2l.jpg'">ONE</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/1.jpg'; var thelink = 'http://sc-lee.com/art/1l.jpg'">TWO</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/3.jpg'; var thelink = 'http://sc-lee.com/art/3l.jpg'">THREE</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/4.JPG'; var thelink = 'http://sc-lee.com/art/4l.jpg'">FOUR</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/5.jpg'; var thelink = 'http://sc-lee.com/art/5l.jpg'">FIVE</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/6.jpg'; var thelink = 'http://sc-lee.com/art/6l.jpg'">SIX</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/7.jpg'; var thelink = 'http://sc-lee.com/art/7l.jpg'">SEVEN</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/9.jpg'; var thelink = 'http://sc-lee.com/art/9l.jpg'">EIGHT</a> <br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/11.jpg'; var thelink = 'http://sc-lee.com/art/11l.JPG'">NINE</a> </div> <div id="contentb"> <img id="img1" name="mainimage" src="http://sc-lee.com/art/2.jpg"> <br /> <a href="#" onclick="javascript: window.open(thelink); "> + fullsize</a> </div> </body> </html> i'm afraid i just don't know enough about the differences between IE and firefox javascript compatability to fix this. please help! thanks, stephanie |