Member Avatar for uringinteristi

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

  • 3 Contributors
  • 4 Replies
  • 114 Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by kanaku
Member Avatar for kanaku

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..?

Member Avatar for essential

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

<!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>
Member Avatar for uringinteristi

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?

Member Avatar for kanaku

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)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.