How to adjust size of grid in html using JQuery? -
i wish create simple grid in html. following code seems job done:
$(document).ready(function() { var rows = 75; var columns = 25; var htmlstr = ""; htmlstr += "<table>" for (var c = 0; c < columns ; c++) { htmlstr += "<tr> " for (var r = 0; r < rows ; r++) { htmlstr += "<td bgcolor = '#ff0000'> " htmlstr += "<div class='square' id='p" + r + "-" + c + "'> </div>" htmlstr += "</td>" } htmlstr += "</tr>" } htmlstr += "</table>" $("#container").html(htmlstr) });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!doctype html> <html lang ="en"> <head> <meta charset="utf-8"> <meta name ="viewport" content = "width-device-width, initial-scale-1.0"> <script src="teststuff.js"></script> </head> <body> <div id ="container"> </div> </body> </html>
however resulting grid very, small.
if insert character grid becomes big. want grid squares. way me achieve this?
Comments
Post a Comment