View Poll Results: is that simple code snippet
YES	1	100.00%
NO	0	0%
YES,but there's uncomplite	0	0%
Voters: 1. You may not vote on this poll

Ad:

HTML and CSS Discussion Thread
Unsolved
Views: 740

Permalink

Dec 30th, 2008

Need Help

Expand Post »

Newbie need help to create a simple table with javascript. Any body who can, please answer.

uringinteristi

Reputation Points: 10

Solved Threads: 0

Newbie Poster

Offline

17 posts
since Dec 2008

Permalink

Dec 30th, 2008

Re: Need Help

Perhaps give more details [circumstances] of what and why you need to do it? (because it's different if you're using a blogging platform, or if hand-coding everything)

Why do you need to use javascript to make a table..?

kanaku

Reputation Points: 70

Solved Threads: 15

Posting Whiz

Offline

378 posts
since Jan 2007

Permalink

Dec 30th, 2008

Re: Need Help

Yeah i agree to kanaku's point. But since we all have it here. I'l throw a simple demo regarding this issue.

html Syntax (Toggle Plain Text)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Creatingt Simple table Using JavaScript</title>
 
<script type="text/javascript">
<!--
function tableSamp() {
   var body = document.body;
   var table = document.createElement('table');
for ( var x = 0; x < 2; x++ ) {
    var tr = document.createElement('tr');   
for ( var i = 0; i < 10; i++ ) {
    var txt = document.createTextNode('Row ' + (x+1) + ' Column ' + (i+1));
    var td = document.createElement('td');
    td.appendChild(txt);  
tr.appendChild(td); 
table.appendChild(tr); 
body.appendChild(table); 
    var cols = document.getElementsByTagName('td');
for ( y = 0; y < cols.length; y++) {
eval('cols[' + y + '].style.backgroundColor="rgb(' + (y*5) + '%,' + (y*12) + '%,' + ((y+10)*8) + '%)";'); 
      } 
    } 
  }
}
window.onload = tableSamp;
//-->
</script>
<style type="text/css">
<!--
html { min-width: 1000px; }
table { border-collapse: collapse; width: 100%; text-align: center; margin: 0 auto; }
tr { line-height: 160%; }
td { border: thin dashed #f5f5f5; padding: 0.3em 0 0.3em 0; color: #000; }
-->
</style>
</head>
<body>
 
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Creatingt Simple table Using JavaScript</title>

<script type="text/javascript">
<!--
function tableSamp() {
   var body = document.body;
   var table = document.createElement('table');
for ( var x = 0; x < 2; x++ ) {
    var tr = document.createElement('tr');   
for ( var i = 0; i < 10; i++ ) {
    var txt = document.createTextNode('Row ' + (x+1) + ' Column ' + (i+1));
    var td = document.createElement('td');
    td.appendChild(txt);  
tr.appendChild(td); 
table.appendChild(tr); 
body.appendChild(table); 
    var cols = document.getElementsByTagName('td');
for ( y = 0; y < cols.length; y++) {
eval('cols[' + y + '].style.backgroundColor="rgb(' + (y*5) + '%,' + (y*12) + '%,' + ((y+10)*8) + '%)";'); 
      } 
    } 
  }
}
window.onload = tableSamp;
//-->
</script>
<style type="text/css">
<!--
html { min-width: 1000px; }
table { border-collapse: collapse; width: 100%; text-align: center; margin: 0 auto; }
tr { line-height: 160%; }
td { border: thin dashed #f5f5f5; padding: 0.3em 0 0.3em 0; color: #000; }
-->
</style>
</head>
<body>

</body>
</html>

essential

Featured Poster

Reputation Points: 114

Solved Threads: 138

Posting Shark

Offline

973 posts
since Aug 2008

Permalink

Jan 4th, 2009

Re: Need Help

Thank you for all your atension with my Thread Thankyou so much. Actually I have project to make moving text in tagcloud. So first thing I must create a simple table and then create moving text .Would every body can help?

uringinteristi

Reputation Points: 10

Solved Threads: 0

Newbie Poster

Offline

17 posts
since Dec 2008

Permalink

Jan 8th, 2009

Re: Need Help

Eh. Don't use tables for the tag-cloud. :p it's called a tag-cloud because of the 'random'-ness of the text. Putting it in a table will create an ordered, block-structure. Try this code in your html body:

<p><span style="font-size: 11px">Thing 1</span> <span style="font-size: 20px">Thing 2</span> <span style="font-size: 16px">Thing 3</span> <span style="font-size: 14px">Thing 4</span> <span style="font-size: 12px">Thing 5</span> <span style="font-size: 28px">Thing 6</span> <span style="font-size: 19px">Thing 7</span> <span style="font-size: 15px">Thing 8</span></p>

--- quickly taken from this tutorial

For your 'scrolling' effects. You can choose from a load of effects at dynamicdrive. But I suggest you choose one consistent effect only. (Or just use CSS to change the color)

kanaku

Reputation Points: 70

Solved Threads: 15

Posting Whiz

Offline

378 posts
since Jan 2007

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.

Previous Thread in HTML and CSS Forum Timeline: Forms and dropdowns

Next Thread in HTML and CSS Forum Timeline: sos.sos...help me... help me... plz

DaniWeb Message

Cancel Changes

User Name
Password