HTML - Text Blurry In Transparent Iframe
Please help, I am uploading my site back to my server after some updates. The main page is blurring all the pages linked via iframe.
If you visit the main page all my text is blurry: http://www.sillywabbitproductions.com/ But if you visit the actual pages the text is just fine: http://www.sillywabbitproductions.com/main.html I've already diabled ClearType in case that had anything top do with it. Any idea what's causing this? Thanks in advance. Similar TutorialsHi, As the title suggests, i need a code to make an iframe transparent. I know there are so many other sites and forums out there which give u the code to do this, but it don't seem to be working for me. What is wrong? Does this code need to be in the head tags of the page that contains the iframe or in the source page itself? Or does it need to be in the body? here is the bit i am talking about: HTML Code: <body STYLE="background-color:transparent"> Please could someone help me and give me step-by steps of what to put where. Thank you Hi, I have a header in blue, and the text is black. I would like the header to be a darker blue, and the text transparent. Could anyone help? Thank you. Nick I have seen this many times but can not figure how to do it. Its the transparent images or text in text boxes, one example of this is http://au.movies.yahoo.com/Coming+Soon/to-cinemas/ At the top right you can see that transparent yahoo image in the text box and when you click it it disappears then comes back? can someone tell me how this works? Thanks Hello. I've searched numerous times on Google for answers to this problem I'm having and I'm getting no help. I've posted here before with the same website but I have a different layout (or I'm making one) so I have a different problem. To view the website click here, although I don't have the new layout up on the web yet. I have a picture as the background and I have the semi-transparent tables, but the text is semi-transparent as well and I really don't like that. The code I have for the semi-transparent tables is: Code: table, tr, td { filter: alpha(opacity=75);filter:progid:DXImageTransform.Microsoft.Alpha(opacity=75); -moz-opacity:0.75; } So that's all fine and good, but I can't get the text to show up solid. Is there a way that I can have the semi-transparent tables and full opacity text? I'm extremely bad with CSS, so I don't know much what I'm doing here. I want to make a transparent rectangle with rounded edges to be where I put my text. I already found this: http://www.spacedust.com/scripts/rounded_table/ but I don't know if it'll work. I have posted clear images in 1634x200 header slices on photobucket. However, being new to html coding and writing code, when I code using the following, the images come out all blurry. Is there something in the code that may be altering the image resolution from its native crisp, sharp source files? I have tried jpg, png and used both a large file and exact matching file in terms of dimensions and I continue to get the same blurry results. Thanks. Here is the 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> </head> <body> <table width="100%" border="0" align="center"> <tr> <td align="center"><a href="http://stores.ebay.com/Summit-DVD-Movies-and-Blu-Ray-Disc?_rdc=1"><img src="http://i909.photobucket.com/albums/ac297/summitdvd/Ebay%20Store%20Images%202/header_logomain-4.png" alt="header_logo_top" width="1634" height="169" border="0" /></a> <img src="http://i909.photobucket.com/albums/ac297/summitdvd/Ebay%20Store%20Images%202/header_LLowCorner-1.png" width="58" height="31" alt="header_corn" /><a href="http://stores.ebay.com/Summit-DVD-Movies-and-Blu-Ray-Disc?_rdc=1"><img src="http://i909.photobucket.com/albums/ac297/summitdvd/Ebay%20Store%20Images%202/but_home-1.png" width="84" height="31 " border="0" /></a><a href="http://members.ebay.com/ws/eBayISAPI.dll?ViewUserPage&userid=summit_dvd"><img src="http://i909.photobucket.com/albums/ac297/summitdvd/Ebay%20Store%20Images%202/but_about-1.png" width="84" height="31" border="0" /></a><a href="http://stores.ebay.com/summitdvdmoviesandbluraydisc/pages/policies__W0QQ_modeZpreview"><img src="http://i909.photobucket.com/albums/ac297/summitdvd/Ebay%20Store%20Images%202/but_policies-1.png" width="84" height="31" border="0" /></a><img src="http://i909.photobucket.com/albums/ac297/summitdvd/Ebay%20Store%20Images%202/EbayHdr1634x200r3_07.png" alt="header_bot_bg" width="1324" height="31" /></td> </tr> </table> </body> </html> Why is it that my button on IE looks like crap, with blurry corners and sadly rounded edges... http://unreal-deals.com/temp/ie-submitbutton.html But this guy's button in IE looks just perfect, with no blurry corners and sharp square edges? http://www.splittestaccelerator.com/1/?cnotes*18059868 hi, i've a very simple html page, where i have an iframe. The problem is that i want to add some text below the iframe. however, my text keeps showing up on the right hand side of the iframe. i've looked at the tutorials discussing the tags available for iframe, but surprisingly, none seem to relevant to this. Code: <html> <body> <table border="0" cellspacing="10"> <table border="0" cellpadding="0" cellspacing="0" align="left"> <td valign="top"> <iframe src="mySource.jsp" height="700" width="600" frameborder="0" scrolling="auto"></iframe> </td> </table> This should be displayed below the iframe but actually gets displayed on the right </body> </html> any help / guidance in this will be much appreciated. thanks in advance! i'm trying to put a transparent png img on a colored background, in IE6 the transparent part of the img appears as a color instead of transparent how can i fix that??? the attached imgs shows how it's appearing in IE6 and FF I have a problem; Look at this; {a text field} <iframe id="iframe1" src="google.com/gog.html? + the letters in the text field"> My problem is to get the src in the iframe to be google.com/gog.pl? + the letters in a text box anywhere on my site. {google.com was just an example} Do you know this better than me? Hi, I want to implement something like this into my website, with a single 'snipped-off' corner image on an otherwise square, bordered content surround. I'm really not sure what would be the best way to do it, though. Would you use divs or tables, and how exactly would you go about implementing it? ( example: ) P.S. the real layout isn't that hideous, thankfully--just clear colours so you can see what's going on. Any help would be greatly appreciated! J-L Hi, I have to make my div transparent so that content(text and image) of container div donot become transparent. Attaching my code u can change image name. Code: <html> <head> <title>Image opacity script - www.designplace.org</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> .transparent{ filter:alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3; } .notTransparent{ filter:alpha(opacity=100); -moz-opacity: 1; opacity: 1; } </style> </head> <body bgcolor="#FFFFFF" text="#000000"> <div style="width: 500px; height: 500px; background-color: red;" class="transparent"> <div class="notTransparent"> A <span class="notTransparent">transparent</span> div. <img id="tuxie" src="next.gif" width=254 height=46 style="-moz-opacity:30%;filter:alpha(opacity=30)"> </div> </div> </body> </html> Problem :-- In my case every thing in container div becomes transparent. How can I make sure that image and text does not becomes transparent however container div whose background color is red becomes transparent. Thanks I am suprised i have never come across this before i am sure i must have tried adding a png with no background to a non-white page background and viewing it in IE6, so i have just found that IE6 gives a transparent png a bluey/grey background. After a quick google it seems thereis a solution for IE wwhich is to use, filter:progidXImageTransform.Microsoft.AlphaImageLoader() which i tried and it works as it should but i am suprised i have never seen or heard of this code before, consdering the amout of html code i have ever looked through which is a lot, someone must have used a transparent png on their site, what am i missing why have i never seen this before ?? http://junksen.tumblr.com/ Hi! i just wanted to know if i can make the right bar, the post area, and the left bar transparent so i can see the background through them if anyone can help me out, please let me know y0! I have a part in my site wherer if u go out of line, it will start a scrollin thing, ill show u how it is now. on the part where it is squared in red instead of that color can i get it transparent? also on the outside of the arrows! p.s. here is the codes: Catagory: Code: <!--Other :Other--> <td valign="top"> <div class="content" style="position:relative; overflow: auto; width:150px; height:100px; left:-95px; top:700px;"> <font face="verdana" size="2"> Other<br> <!--Search Form Starts--> <center><FORM action="/cgi-bin/htsearch" method="post"> <input type="hidden" name="restrict" value="http://www.spt.pcaworld.net"> <input type="hidden" name="exclude" value="/index.html"><p> Search: <input type="text" name="words" size=20 maxlength=20 value=""> <input type="submit" value="Search"><br> Match: <select name="config"> <option value="htdig">with Extensions <option value="exact">Exactly </select> </form> <!--Credit Starts--> <!--http://htdig.sdsu.edu by Andrew Scherpbier andrew@contigo.com--> <!--Credit Ends--> </center> <!--Search Form Ends--> <!-- Start Bravenet.com Service Code --> <center><script language="JavaScript" type="text/javascript" src="http://pub38.bravenet.com/counter/code.php?id=401896&usernum=3260284116&cpv=2"></script></center> </div> </td> here is the style: Code: <!--Style--> <style type="text/css"> A:link { color: #000000; text-decoration: none; font-weight: italic;} A:visited { color: #EC0010; text-decoration: none; font-weight: normal;} A:hover { color: #000000; text-decoration: none; font-weight: normal;} body { SCROLLBAR-FACE-COLOR: #D70018; SCROLLBAR-HIGHLIGHT-COLOR: #D70018; SCROLLBAR-SHADOW-COLOR: #D70018; SCROLLBAR-3DLIGHT-COLOR: #D70018; SCROLLBAR-ARROW-COLOR: #ffffff; SCROLLBAR-TRACK-COLOR: #FB0000; SCROLLBAR-DARKSHADOW-COLOR: #FB0000; BACKGROUND-COLOR: #000000; } .bgtable { border: 0px solid #000000; background-color: #EC0010; background-image:url("http://i12.tinypic.com/61n9q81.png"); width: 1007px; height: 802px;} .content { border: 0px solid #000000; color: #000000;} </style> <!--/Style--> plz help! Does anyone know how to make the radio button transparent? I need to put a radio button on a textured background but I don't want the rectangle and actual button to show up on top of the background. I wanna the image working as a radio button. Thanks in advance! I have this code in my website: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>PinkuHaruKoneko</title> </head> <body text="#ffffff"> <font face="arial"> <style> <!-- A{height:1px;behavior:url(linkhilight.htc);filter:progid:dximagetransform.microsoft.gradientwipe duration=1)} A:link { text-decoration: none; color:#ffffff;} A:visited { text-decoration: none; color:#ffffff; } A:hover { text-decoration:line-through; cursor: crosshair; color:#ffffff;} body { scrollbar-arrow-color: #CEE0F6; scrollbar-darkshadow-color: #090E3C; scrollbar-track-color:#090E3C; scrollbar-face-color: #275674; scrollbar-shadow-color:#CEE0F6; scrollbar-highlight-color:#CEE0F6; scrollbar-3dlight-color: #090E3C; text-align:justify} h1 { border: 1px solid #000000; background-color:#0000ff; font-size:14px; text-align:center; } --> </style> With that code, text align justify -elements doesn't work and h1 doesn't work at IE. If I take away that thing before <html>, it works but in IE bg isn't transparent anymore. Is there anything what I can replace that doctype-thing and get that code work in Mozilla and IE? Hi Friends, I have problem in IE6 using transparent png image. I have already include the IE6 png fix javascript file. If suppose using img tag, its no problem, but I set the png image within my td background its not display properly. here my code : <td align="center" valign="middle" style="background-image:url(images/footer_bg.png); background-repeat:no-repeat;"> also i attached the sample image. this is my problem. so anybody knows or face the same problem give me the solutions. Yours, vjn_23 (vijayan M) I have a website which consists of a flash movie, which is transparent, placed on top of an image. Currently the only way I can do this is with: Code: <div style="position: absolute; top: 0; left: 0; width: 800px; height: 604px; z-index: 3"> Which doesn't allow me to scale the elements, as they are positioned absolutely. What I want to be able to do is position the elements one on top of each other, but have their height set to 100% rather than a fixed amount, and for them to be centered. Any ideas? Thanks Fred |