I have a simple HTML table that I want to use as a progress bar - by
changing the width of the two TD elements with javascript, you show
progress. The problem is that when I change the width to 100 and 0
resp., you still see a sliver of white for the right cell... any way
to do this, it's drivin me nuts! I tried also changing the back color
of the right cell to blue when it hits 100, but it only works in
Mozilla/Firefox, not IE....
I'm absolutely new to JavaScript and HTML, although I've done a fair amount with Visual Basic (VB6 and macros in Word and Excel). I'm trying to create a form with different sections. When the user checks a checkbox for a section, the table with the input areas for that section will appear; if the user changes his mind and unchecks the box, that table will go away. I've played with the visibility attribute, and that works - sort of. I can hide the table from view, but it's still there in the page, taking up as much room as it does whether visible or not. There's a big empty gap containing an invisible table or two if the user only selects the third or fourth section.
function showhide(element){
if(document.getElementById(element).style.visibility=="hidden"){
document.getElementById(element).style.visibility="visible";
[code]....
I have a list menu that when the page is opened is stretches the page out wider than the screen because there is an entry that is very long. Is there a way to make the list box only stretech out a certain length in order to stop this?
View 3 Replies View RelatedI am combining a select box enhancer called Chosen from [URL]... When the States section is toggled, the accordian's area is not grown when the chosen is activated and shows a scrollbar when it shouldn't.How do I need to handle that?
View 2 Replies View RelatedI have this layout
And then I have this code to determine the cell height.
So basically I need both my first and last cells to be able to have the mainbody cells height, but that code only works when placed in or after the cell being measured, in this case "mainbody", my question is this, is their a way to get the size of the mainbody cell before its done loading somehow?
I have a javascript program that uses a HTML table as an Excel-like grid. The user can use arrow keys to navigation the grid. When the user selects a cell and then hits <Enter> key, the program turns the cell from read-only to editable (an input box), and select all the text in the input box. When the user hits <Esc>, the program cancels the changes that the user has made and turns the cell back to read-only. So far so good. The problem is that as soon as the user hits <Esc> key and turns the cell back to read-only, I find that I cannot move the input focus back to the cell any more. Actually I cannot move the input focus back to _any_ cell in the table. When this happens, the user cannot use arrow keys to navigate the grid any more (like the grid has lost the input focus). The user needs to use the mouse to click at a cell in the table to get things working again.
The user can get around with this problem by un-selecting the text from the input-box before hitting <Esc>. But this is not something that I expect the user to remember to do. I need a way to fix this problem. I tried the logical thing and programmatically un-select the text before turning the cell back to read-only. But this actually made thing worse - this causes the workaround to stop working.
The only browsers that I have tested this program is IE6 and IE8. I have not tested this in any other browser.
Attached is a simplified version of the program that can show this problem in action. This simplified program first adds an empty table on the web page, and then creates an instance of the CEstGrid class that takes care of the grid. CEstGrid will add two rows of test data into the table with two columns in each row. The user should use a mouse to click at one of the cell, and the cell should be highlighted. The user uses arrow keys to navigate the table. When he reaches the end of the table, he will wrap around to the other side of the table. Let say the user reaches the cell in row-1 column-2, he hits <Enter> to change the cell to editable. He will find the text in that cell to be highlighted. When he hits <Esc> at this moment, he will find that he cannot use the arrow keys to navigate the table any more, and this is the problem. Please rename the test program from .TXT to .HTML to test it.
imagine table with 15 rows and 3 columns. If I move mouse over any cell I want some other specific cells to change their borders like with pseudo-class :
example
<style>
.boryellow {border: 3px solid yellow}
.borblue {border: 3px solid black}
</style>
this will work, a cell can change itself
<td name="third" class="boryellow" onmouseover="this.className='borblue'" onmouseout="this.className='boryellow'">cell</td>
even when dealing with empty images - click on link will change border of different element - imgs, but not span or td ...
<a href="#" onclick="document.all.xxx.className='borblue'; document.all['name'].className='borblue';
[code].....
Replacing any element link by "third" or "spanx" will cause stuck ant not executing other actions.
Iīve just launch my website-portfolio, well itīs not yet the final version but it is almost and despite I am satisfied with the final result Iīve detected a really strange bug that only happens sometimes. The thing is when the first introduction Slide appears (the one with the hand-made drawings), sometimes the images shrink from the normal size to small tiny images. This doesnīt happen always and if you refresh the page it disappears.
Follow the link to the page were the bug happens - [url]. I'm using jquery cycle plugin, check it out.
<script language="JavaScript">
function changeColor(cell_id){var state1="#dde6ed"; var state2="#ffc20e"; var cellid = new Array ("id1", "id2", "id3", "id4", "id5", "id6"); for(var i = 0; i < cellid.length; i++){var nav = document.getElementById(cellid[i]); if(cellid == nav.id){nav.style.backgroundColor=state2;} else {nav.style.backgroundColor=state1;}}}
</script>
what is wrong with this script. I put an onClick= changeColor(this);" in my <td> tag to call the script but still not working.
I have a table with two rows and 4 columns, the first cell has rowspan of 2. How do I insert something into the first cell only? How can I get the cell index of the first cell?
View 4 Replies View RelatedI've got this code that creates a new new row and cell. I then put some
text into the cell with innerHTML - works beautifully with Firefox but
fails with IE. I guess IE doesn't support this way of doing it, but is
there another way of doing it with DOM?
newr = document.createElement('tr');
stbl.appendChild(newr);
newc = document.createElement('td');
newr.appendChild(newc);
newr.cells[0].innerHTML = (nr+1)+". "+sa[ti][nr + 1]+"<br><hr>";
(works in firefox but fails in IE 6+ too...)
My web page has thumbnail pictures, and when the user clicks on a
thumbnail, I change the image source of a full-size image elsewhere on
the page. I'd also like to change the caption of the full-size image,
but I'm not sure how to set the value of the text. I've tried creating
a form with a single input field, and I can set the value of that
field, but the field has a sunken style that I can't get rid of, and
I'd like to find a different way of displaying the text.
Is there an easier way to change the value of a text field?
<html>
This is a simple meal order selection.When i click on the radio button,it will insert a new row to a table and insert the value. And there also got delete button to delete each row.
After finish order,i need to total up the prices.But,when i click on the calculate button, it shown error on page.How can i get the values and total up all the values?
I have a table and i want that when I select a row (onclick event) two functions to be called.
This is the code (it is PHP generated):
The first onclick function (named colorChange) works, but the later does not.
I don't know why is that. I used this configuration before and it worked.
So.. the js function that does not work is this (it shows me no alert):
I repeat that the first function (colorChange) works, and it is put in the same place (file) as the above one.
Is it possible change the content in a table cell with Javascript...
View 1 Replies View RelatedHow can I change the background IMAGE (not just color) of a CELL in a table?
I know that I can do this using CSS, but I really need to be able to do it
using JavaScript. Anyone know how?
Must be able to change the image for each cell - not the whole table.
My website formatting knowledge is mostly HTML; I know hardly any
Javascript. Recently I created a site with a nav bar in table format across
the top of the page, and I made the background colour of the cell with the
name of the page that the reader was on a different shade, like this:
Home | This | That | Other | Etc.
If you were on "Other" page, for example, the background colour of the
"Other" cell was a different shade from the others. I created this by
altering the code on each page.
This site was hosted with a web host that has SSI, and the nav bar became
the same file for every page, so we lost this minor navigation aid. Someone
mentioned that the same effect (a different colour or shade for the cell
with the page name) could be achieved with Javascript, but since I don't
know Javascript and we'd run out of time, we didn't do it.
Now I'd like to have this different colour for the page name cell at another
site using SSI for the nav bar. Is this possible? If so, how? To make it
even more fun, some of the page names are entry points to another section of
the site. If I can make "Other" a different colour, for example, I'd also
like to make pages in the "Other" folder have this same feature so that
readers know that they're in the "Other" section of the site. Or is this too
much?
I am trying to learn JavaScript--(complete newbie--and don't know C or
C++). I've been reading "The Book of JavaScript" by Thau.
I don't see anything about table properties in the book. (I would like
to try to write a script so that the background color in a cell in a
table changes color (between two or three specified colors)). How do I
get at the background color property in a table cell?
I have a table as below, I hope the "ecCurrent" will be changed to "no rank" when I unchecked dat.ECRank, what can I do?
[Code]...
I have googled until my fingers bled and can't get a working answer to what I expected to be a fairly simple, common problem (but I guess not): I need to get the text value from row 5, column 3 of a table.
The user isn't clicking on the cell or the row or the table or anything like that. The table is dynamically built from the server side and I can't assign an id to either the row(s) or the cell(s), but I do have a table id and a table body id. How do you retrieve text given a specific row and column index?
what I need to know is how to get the value from the cells of a html table, for example I have the following 1 12 12 20w I need to retrieve the value of the position(1,2)=12Better, what I need is to retrieve all the values with cycles, something like
for (var i=0;i<($('#tabl tr').length;i++) {
for (var j=0;j<($('#tabl td').length);j++) {
var texto = [[row[i].sectionRowIndex, cell[j].cellIndex,
[code]....
is it possible to get a specific cell data on an html table using javascript? as of now all I can get is which row number was clicked using this snippet
Quote: function getRowData(r) { var i = r.parentNode.parentNode.rowIndex; alert(i); //var x=document.getElementById('myTable').rows[0].cells; //alert(x[i].innerHTML); //document.getElementById('myTable').deleteRow(i); }
and each of my rows has a button which calls the javascript method to get the row number
<input type = "submit" onClick="getRowData(this)">
what I would like to do is to get the first column's cell data of the selected row.
<div id="tabela">
<table border="0">
<tbody><tr><td class="blabla">TVOJE IGRE</td></tr>
[code]....
I am trying to create a TD to a TR & setting the TD properties as follows.
myTabsRow=document.getElementById("tabsRow"); newCell=myTabsRow.insertCell(myTabsRow.cells.length);
newCell.id=tabName+"_data";
newCell.innerHTML="Test"
newCell.onclick=domouseclick('test'); // domouseclick is defined as
function domouseclick(argName)
{
alert(argName);
}
Problems is that i am not able to pass argument to the domouseclick function. It is working fine without the argument. Please help me if anybody knows how to pass argument to this function.
Basically in IE, if a CSS width is defined for a cell (<td> element) as well as having a colspan attribute allowing the cell to span more than one collumn, the cell (eg the border etc.) will occupy the width*colspan but the content will only occupy the width.
View 2 Replies View RelatedLet's say I want a 10x10 table, with 5 preselected cells having their background colors change every 1 second. Any ideas?
View 1 Replies View Related