for IE 5+ I need to be able to change certain TD tags� background
colors, and can�t figure out how to do it...
For instance, in a table with 25 cells, somewhere between 5 or 10 will
need the bgcolor to change at the same time when a user clicks a
button. Right now only one changes when I use something like this...
document.getElementById(�cellchange�).style.backgr oundColor = "FFFFFF"
** (Note, this is not the EXACT code, I am typing from memory... but
it is SOMEthing like thw above...)
where a few td cells have an "id=cellchange" in there tag. I need ALL
of the ones with that ID to change!
Is there a getElementByClass, for multiple similar elements?
I currently have a normal link like Code:<a href="http://sitepoint.com" class="link">sitepoint</a> and when a user clicks on it I want to be able to change the "link" class to a different class. However, I don't want to add anything to the actual link html. Is it possible to do this using javascript without modifying the original link code?
I am trying to dynamically clear the value of a form input field and then submit the form.When I used $('#my_field').val('') to clear the field, it was cleared on the screen but when the form was submitted the original value of the input field was posted.My browser is FireFox and I can see using FireBug that when the field is cleared, firebug is still showing the html code with the old value. E.G. <input type="text" value="old_value" />The same situation occurred if I used $('#my_field').attr('value', '') to clear the field.The same situation occurred if I actually changed the value of the field rather than just clearing it.To work around this problem I ended up using the $('#my_field').removeAttr('value') to clear the field before it was submitted.
I am a complete novice when it come to Javascript. I copied the script for displaying random images at a specific interval (from javascriptkit.com). I would appreciate knowing whether the following is possible:
The pages are based on tables, so the parts that change are all cells.
1. Can I define text instead of an image in the array? i.e. can I have the image change to say an apple in one cell and the next cell have text explaining what an apple is?
2. Would it be possible to put a countdown timer for when the image/text is going to change?
Ive got a small image of a power button and when pressed the inner section on the button changes to yellow, but when its pressed down Im also trying to get part of my H1 (main header logo title) to change to yellow.
Ive created a span with an id surrounding the letters of the H1 that I want to change, the id being : "power";
The javascript that I have come up with so far and works is as follows:
<img id="poweron" src="http://www.sitepoint.com/forums/images/power.png" alt="Power on button" onmousedown="this.src='images/poweron.png';" onmouseup="this.src='images/power.png';"/>
I understand Im not really supposed to be using inline JS, and I know Ive got to create a function for the onmousedown event to trigger changing the H1 text, so am I under the right impression that the JS so far written is redundant and will have to be re-written so thats contained within a script placed just before the closing </body> and an external script for invoking the main function ?
Has anyone ever had problems with changing the src of an embed after the page has loaded?.
I have had this problem 2 times now and in result have had to actually reinitialise the embed on the page with its new src. Is there not a way round this which will save alot less time and alot less coding.
I am working on a Windows application (in C#) that displays some HTML. In one place the HTML is a status window. What happens is the static HTML page is embedded into the application. The static page displayed and then the C# code gets a hold of the HTML DOM from the web browser and updates what pieces need to be updated.
What I need to do now is change the colors of everything on the static page. At present there is an embedded CSS style in the HTML and all the colors are defined there. Using the DOM, via C# code, how do I change the colors of everything?
1: Can I simply update the CSS and it will auto magically happen? If so, how does one update the CSS via the DOM?
2: Do I need to go to each individual item and change the color there?
3: Is there a better way to do this all the way around?
I have a few radio boxes where a user can choose different options and I want to show an explanation of each option after it's clicked. Here's what I have:
'function describetype(){ ' if (window.event.srcElement.value == "starter") typedesc.innerHTML="A Starter request is for a new employee who's never worked for cadbury or the Bottling Group before."; ' if (window.event.srcElement.value == "leaver") typedesc.innerHTML="A Leaver request is for an existing employee who's permanently leaving the company."; '}
'function starter(){ 'typedesc.innerHTML="A Starter request is for a new employee who's never worked for cadbury or the Bottling Group before."; '}
'function leaver(){ 'typedesc.innerHTML="A Leaver request is for an existing employee who's permanently leaving the company."; '}
function describetype(o){ if (o == "starter"){ typedesc.innerHTML="Starters are...etc."; } if (o == "leaver"){ typedesc.innerHTML="Leavers are...etc."; } }
</script>
The first "toggle" function works fine but the "describetype" won't work. Here's the HTML:
The error keeps saying that "starter" or "leaver" is undefined. I'm not much of a javascript guy (mostly the cut and paste variety myself) but everything I've seen says this should work. No?
having a small bit of trouble with some javascript trying to change the background color of a div. The div is id=break and the function to change it is:
function changeBG(){ document.break.background-color = 'ffffff#'}
However that does not work, no colour changes. There is no obvious errors that I can see. Have I misundertsood?
Whats the best way to change text using the DOM? innerHTML makes it easy - for example, I can change the text of a div by indexing the div by its id and then setting its innerHTML.
With the DOM, its easy to get to an element becuase you can use its id. But to get to the insides of an element, you have to delve into the children.
Can I be garaunteed that the first child of a div will be the textnode I want?
I feel as if I'm groping blindly in the dark after I get my div and start changing the children. I can get things to work that way, but I don't feel comfortable about it.
This is some free code includeing with dreamweaver, What it does is check if flash player is installed. If it is installed then goto a url, if its not goto a differnt url. What I want to do, is change it from URL to variables so, instead of like test.asp?flash=true, I would like <%flash=true%>.
Heres the code, with an onload function.
function MM_checkPlugin(plgIn, theURL, altURL, autoGo) { //v4.0 var ok=false; document.MM_returnValue = false; with (navigator) if (appName.indexOf('Microsoft')==-1 || (plugins && plugins.length)) { ok=(plugins && plugins[plgIn]); } else if (appVersion.indexOf(Ɖ.1')==-1) { //not Netscape or Win3.1 if (plgIn.indexOf("Flash")!=-1 && window.MM_flash!=null) ok=window.MM_flash; else if (plgIn.indexOf("Director")!=-1 && window.MM_dir!=null) ok=window.MM_dir; else ok=autoGo; } if (!ok) theURL=altURL; if (theURL) window.location=theURL; }
OnLoad event Where it says Variable/URL is where I would normaly put the url, first one is if its found, second one is not found.
I'm trying to write a script that checks for when the enter button is pressed in a textarea and then appends a <br />. I have this:
function appendBreak (field, event) { var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode; if (keyCode == 13) { document.formName.inputName.value = document.formName.inputName.value + '<br />' alert('Captured Enter Key'); } else return true; }
And in the particular element that i want to call this function I have this attribute. onkeypress="return appendBreak(this, event) This code will work on regular text type inputs (i.e. <input type="text"....>). But I was having trouble identifying the value of a textarea.
This is what I currently have:function appendBreak (field, event) { var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode; if (keyCode == 13) { //this.value = this.value + '<br />' alert('whats up?');
It shows that what I am calling is undefined. But it does append the <br /> after the undefined. So if I could just locate the <textarea> value then I'd be okay.
I would like to change the visibility of the contents of a DIV by clicking a button or link. If possible, I'd like the button to toggle the visibility on/off. If not, I'll just have two buttons, one to make it visible, the other to hide it.
Also, I'd like the page content under the DIV to move up/down as the DIV is hidden/visible (as if the text inside the DIV did not exist when the it was hidden).
The code I tried before posting was this: function visibility(id){ document.getElementById(id).style.visibility=hidden; } I couldn't find any documentation on the Visibility property, so I didn't know how to use it correctly. Also if there is a better way to achieve the effect I want than using style.visibility, please post it.
The button is a blob of colour (.jpg) with text over the top. I want two things to happen: first, when the cursor is rolled over the .jpg and then the text, I want the text to change colour. This works ok. Second, I want to link to industry.php when clicked. This works ok over the .jpg but, obviously, not over the text.
Code: function toggleVisiblity() { var name1="eg"; var tbl = document.getElementById("chart1");alert(tbl);alert(tbl.style.display); alert(tbl.nodeName);var clink=document.getElementById("chartlink");
I would like to load in content from an xml file, when the user clicks on one of the products from the sidemenu. The content will be an image and text for each type of headphone.I'm stuck on starting off, I'm not sure how to associate the click of one of the models with the correct model in the XML. In other words, in the JS how do I select the content for CX 300 in the same XML if they click on this model, I just need a little orientation please
I want to add a caption to certain images on a website I'm building when the user moves their mouse over it, along the lines of "Click to Enlarge". The HTML code I've got is as follows:
<div class="overlay"> <a href="#"><img src="image/example-4.jpg" alt="Example Image" /></a> <div><p>Click to enlarge image</p></div> </div> The DIV with the caption is set in the CSS to display:none; and I have the following JavaScript code which is supposed to change this property to block on hover:
Basically, I'm trying to make a "chat-like" updater with javascript.
html.html includes the following:
<html> <head> <script> var t;
function getData () { document.getElementById("dataStore").href = "test2.html"; }
function update (message) { getData (); document.getElementById("txt").innerHTML= message; t = setTimeout ("update ()",1000); } </script> </head> <body onload="getData()"> <div id="txt">hello</div> <script id="dataStore" type="text/javascript"></script> </body> </html> The file that it should get variables from is from test2.html, which is below:
var updateData = "hello!dasd";
update (updateData); For this example, basically - I want javascript to change the "hello" in test.html to "hello!dasd" found in a variable in test2.html. This should keep asking for new updates from test2.html (which will be dynamic with php).
I just read "JavaScript 101 - Part 1," and had a question about the specific part linked to above:
Is there a more efficient way of switching colors every row other than calling it every time you want to start a new row? Also, how can the row number be increased each time if the variable rownumber is only increased by one within the second half of the function? What if the row is even? Is the number not increased? Code:
I am using a table to help align elements around a page, I would usually be using divs etc but as it is a complicated setup I have chosen to use a table. Anyway on the right hand side of the page I have a column which contains a photo, this td has its position fixed on the screen so when the user scrolls down the page only the gallery td scrolls and the rest remains where it is. However when testing on a smaller screen yesterday I realised that if my td is larger than the monitor or screen then the user cannot scroll down the fixed element. I have therefore come up with the solution of applying 'overflow: auto' to the fixed element. This will only work though if the height of the element is set to the height of the inner page. This is where my script comes in, I need to load the page then change the height of the TD dynamically so that the td can be scrolled down. This is my javascript:
