DaniWeb IT Discussion Community

DaniWeb IT Discussion Community (http://www.daniweb.com/forums/index.php)

- HTML and CSS (http://www.daniweb.com/forums/forum143.html)

- - Need Help (http://www.daniweb.com/forums/thread164889.html)

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

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

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>

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?

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)