HTML - Border Color For Textbox Is Impacted On Changing The Background Color On Focus Onblur
Hi,
I want to change the background color of my textbox on focus and change it back to white on onblur event. Issue: When i change the back ground color for text box on focus it properly changes it. But when i leave the focus from textbox border color for text box is impacted and its changed to white. Please help so that border color for textbox is not impacted only background color should change here is the sample code <code> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <p> <input name="text1" type="text" id="text1" value="textbox 1" onfocus="this.style.background ='#cad5df'" onblur="this.style.background='white'"> </p> <p> <input name="text2" type="text" id="text2" value="textbox 2" onFocus="this.style.background = 'yellow'" onBlur="this.style.background='white'"> </p> </body> </html> </code> Similar TutorialsHi there. My site's movehumanityforward.org and I have in the bottom right area a Facebook "like" area. It looks fine in Chrome, Firefox, and Safari. But IE shows a white background for some odd reason? I'm curious why and would like to know if someone has a work-around. Thank you friends! This is a coursework assignment. i've noticed on some website it gives you the option to change the color of the background too a high contrast version. is this possible without using Javascript? (html5 ideally). Obviously i'm not expecting someone to tell me what to do but a link in the right direction would be nice please ok i had resolved my earlier problem of my links being spaced earlier with help fro pegasus and now i got a new problem lol. i know how to change the background and colors for my links using css in most cases by calling a.Blah:link... and so on and the :hover... but in this case it is not working. Here is my css at the moment. Code: #Nav{ width: 948px; height: 18px; border-top: 1px solid #FFA701; border-right: 1px solid #000000; border-left: 1px solid #000000; border-bottom: 1px solid #FFA701; } #Nav a{ padding: 0; margin: 0; height: 18px; color: #ffffff; text-transform:uppercase; text-decoration: none; font-weight: bold; overflow: hidden; } #Nav ul li {display: inline; padding: 0px 5px;} #Nav ul {margin: 0px; padding: 0px; } my problem is that my links i want to be starting on a black background and they'll be white colored links. (which they are i'm using body bg for my page.) then i want as they are visited to stay white colored. the main thing i would like to have is that when you hover over them, the links turn black and the background of the links turn white. now i know it's easy with hover: {background:#000000} but i don't know how to place it because when i did it did not work. thx in advance edit: oops i posted this in html. (still help anyway it has somewhat to do with html probably ) ill post in css also though Hello all! Does anybody noticed that font colors are treated as background color while printing in IE? I just set a <font color=#f0f0f0>MY TEST</font> or <span style="color: #f0f0f0">MY TEST</span> and, on screen, it's OK. On print preview, it goes black. I can print in grayscale only if I turn "print background images and colors" on. Does anybody has a workaround on it? It will be a watermark, so it should be printed in grayscale. I dont think I'm setting a background color, specially on first example (color of the font). Thanks! hiii. this may be a silly question, but i still cant figure out how to add the color of the border in the <img src> code. for example... <img src="lalala.jpg" border="2" BORDERCOLOR="??"> or is it not possible? I thought you changed the background color of a division by typing: <div bgcolor = "color"> but that didnt work. So can someone tell me how to do it? For some reason my site looks just fine in Internet Explorer, but in Firefox the border colors are off. Here is my site: www.allformommies.com You can see the first table has the correct color border (light purple) but the others all appear in black. I know this is a goof on my part, but can't for the life of me figure it out. If anyone could help me figure out how to get all of the table borders light purple, I'd be very appreciative. Thanks! I have a table with cells in the middle. I set my border="0". and I still see a white outline. My background has a color and I see white where my cells are. So I used the bordercolor=" " command, but still see white no matter what color I pick. Code: <table width="1500" border="0" > <tr> <td colspan="2" align="center" bgcolor="#FF9966" ><img src="images/banner.gif" width="800" height="210" alt="banner" /></td> </tr> <tr> <td width="183" align="center" bgcolor="#FF9966">Home</td> <td width="1305" rowspan="7" bgcolor="#FF9966"> </td> </tr> I'm curious how to add color around a image border using html. For example, here is my code: <center><a><img src="http://riverview.topcities.com/ajohn15_10.jpg" border="20" bordercolor="burgundy"></a></center> don't work any help would be appreciated and if anyone knows how i can add a oval frame around using html that would be really nice or link to a tutorial, i have yet to find exactly what i am looking for. Thanks in advance for your help. Hello to everyone, Does anyone happen to know why firefox is messing up the color of my image? (see attached). thanks, NetGD Hi everyone! I have the following input box code: Code: <style type="text/css"> textarea {background-color:FFFFF; background-image:url(); border-width:1px; border-style:inset; border-color:; color: 00000; font-family:Arial;} input {background-color: 3b5998; border-width:1px; border-style:inset; border-color:; color: FFFFF; font-family:Arial;} </style></center> <center> <form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment"> <input type="hidden" name="friendID" value="95663980"> <textarea name="f_comments" cols="50" rows="10">Write Something...</textarea><br> <input type="submit" value="Post"> <input type="reset" value="Reset"></form><br> </center> But for some reason, it isnt showing the background colors/font colors that I specify! Just black text with white background for buttons Any ideas on this? Also -- sidenote, is there a way to have it so when the user clicks into the textarea, it automatically clears the text thats in there already ("write something...") Thank you! I already have the body tags, I want a certain section to have links of a different color. I tried <font color="#####"> but obviously that doesn't work. It seems like i should know this... but I am blank. Hi, ive been working with a template in dreamweaver and have been able to insert my own banner and sidebar, but there is a small part that I cant find where to edit it...any help is appreciated....screenshot below http://imageshack.us/photo/my-images/39/doop.png/ id like to change the green....but cant figure out how Hi guys, I need a help from you guys. I'm having some html pages, and i want to give the option to change the background and font color in the html pages by clicking buttons. And that setting should be saved in the user system, when the user loads the page again in the system, that the page should load with the saved settings. I don't want to go for server side scriptings. Is it possible just in html and Java script. Can you guys help me in this. Thanks in Advanse Kumar Okay. I'm trying to make it so when you mouseover a players "avatar" the border color changes from grey to red. The following code works PERFECT in IE, but FF, the border doesn't show up at all. CSS Coding: Code: img.avatar { border-color : #CCCCCC; border : 1px } img.avatar:hover { border-color : #ff0000; border : 1px } img.avatar:visited { border-color : #CCCCCC; border : 1px } img.avatar:hover { border-color : #ff0000; border : 1px } HTML Coding: Code: <TD align=middle width=104> <DIV align=center><A href="Link"><IMG class=avatar height=75 alt="" src="Image URL" width=75></A></DIV></TD> Hi: Is there any way to change the color or thickness of the <fieldset> box border ? TIA -Mel Smith First off I want to say that I'm new to this forum. Thanks in advance for the help you can give to a noobie. Here's the "dummy page" I put up: http://www.mrcrepe.com/work.html The table I made in dreamweaver. I put it as 900px wide with 1 row and 2 columns. The border color I made a redish/pinkish color as you can see on the outsides, but how do I make that "separater border" into the same color? Right now it's just that silver line. Thanks in advance. -Brian I have a social network. I want my users to be able to pic colors for certain things... I'd really like to use the GUI that twitter has for this, but that could be expensive... So how do I do it? And how do i get smilies to input text into a text box like this one... Dynamic pages are going to be hard i think I'm just wondering how I can find the code to change for the background color of my site. Someone else designed it, and they have left the project so I can't ask where it is. Here is the index.html file, where I'm guessing I should be able to find the place to change it (?) <!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>Baller Magazine</title> <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script> <link href="baller.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> <!-- function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } //--> <!-- function openwin() { window.open('http://www.goodglobalgames.org/js/', 'win','width=870,height=700,status=no,scrollbars=yes,directories=no,menubar=no,resizable=no,toolbar= no'); } // --> </script> <script type="text/javascript"> <!-- function openwindow() { window.open("contact.html", "", "width=600,height=650"); } // --> </script> <SCRIPT SRC="select.js" LANGUAGE="javascript"></SCRIPT> <style type="text/css"> <!-- .style4 {color: #FFFFFF} --> </style> </head> <body onload="MM_preloadImages('images/head-o_05.jpg','img/defblog2.1-o.jpg','img/signup-o.gif')"> <div style="width:940px; margin: 0 auto;"> <table border="0" cellpadding="10" cellspacing="0" style="margin:0 auto; width:940px;"> Or is it in the css stylesheet? I would appreciate any help someone out there can provide. Thank you So I'm rather rusty with html and building a low budget site. At www.cccathens.com I have a background image set to a particular width well at www.cccathens.com/about_us I'm not using the same background image. But I would like the same look as far as having the white on each side. Is there a way to set the background color of the page so it has the same effect? Thank you, Todd |