HTML - Loading Multiple Tables Within One Html File
Hello,
I am currently working on a small library of school videos utilizing the DivX codec (which, by the way is quite something). Each video is centered on it's own page using a table. Rather than creating 25 different HTML documents, I would like to have one that can switch between tables on a click. If you are unsure of what I am suggesting, I found that Apple has implemented just what I want... http://www.apple.com/iphone/ipod/ ... if you click the music tab, it loads a .mov; likewise with the video tab. (without loading an entirely new page) I would like to do this very thing with my table. Can anyone suggest how I can do this? I would appreciate any advice. Thank you, JRosselet Similar TutorialsHi all, I have a .CGI web page written in PERL language. The CGI script loads the information from a database. So when i start the CGI page in my browser and it will only have a value in the whole page. As in when the whole page started in the browser will have only a few characters. Let say it retrieve Temperature recorded and which is stored in the database. So the whole page when loaded will only show 1 temperature. Which is "36.6" and will change when ever the database receive a newer data. In additional, i have a html page. There are tables in the page whereby show information. Like tables having temperature, id, sound and light columns. My Question is that Am i able to load the numbers/characters show on the CGI page directly into the table or any where in the HTML page? What i can think of is putting up a link to the CGI page on the HTML file and click it when i want to view it.But it would just be too troublesome. Lastly, thank you all for your time in reading and please pardon me for my bad English and weak HTML skills as I'm still learning. Thanks & best regards Joseph Is there an HTML tag that loads a text file right into HTML? Or, so to speak, if i had a text file with HTML written in it, how could i get this into a page, without using any server scripting. Possible? thanks a ton ~DeathBlade Hi there, I've got an example xml page that I'm trying to separate into tidier pices (eg separate files for stylesheets, xsl, xml etc). However I don't know how to separate the xml file? Normally in html it's just something like with stylesheets/javascript etc: <script>script here</script> turns into <script src="external.js"></script> But that doesn't work with xml it appears, so can anyone tell me how I can remove the bit in <xml> ... </xml> to an external file and get it loading from that external file...? Hello! Is there a way to load a certain text/HTML file to a certain place in the HTML? I have a "linkbar" at the top of my page. Because i have bunch of "sub-pages" i would like to load that file with links to that position (linkbar), cause the links might change through time and i would have to update all HTMLs. Is that possible withouth frames in HTML? Thank you! Hi I searched through threads to make sure this topic is not posted before but I couldn't find any. I want to put several tables in one page with horizontal line in between them. however, after I post it on the website the tables are stuck together with no space. basically the order is messed up. Is there anyway I can get the format right? Thanks hi everybody, I am working in a html. I defined a functiion in a html file.(first.html) I want to call that function in another html file.(second.html) How can i call that function in second.html file? give some sample code Thanks in advance.... Hi, I was wondering what the easiest way was to add an image loader to a cell on a table. Basically I want the user to be able to browse their images for an image file and then load that to another cell on the table. I don't have much experience with HTML but I need to learn how to do this code for one of my assignments and I couldn't find any clear tutorials on how to do it. Any help would be appreciated. Hi, I need help resolving the following issue in the designing part During the switch from one page/deal to the other, two fields CONTRACT instantly (Shrink in size) and then comes back to the normal shape. those 2 fields are 1) Dropdown list menu (Location) 2) e-mail address field (subscribe) Can I fix this ?? here is the url.. 4grabz.com/index.php?option=com_jegroupbuy&view=jegroupbuy&Itemid=102 A table with 3 colunms in each 2 rows and only one column in the 3rd row, hw to write html scrip for this? Hi html world, My name is Ken G (globalsolutions). I hope I am posting in the right place. I have an issue with one of my pages I created. Since I cannot put a link to the page, may I post the html code? The page looks almost alright. The page was screwed up so I took out the <td> and the <tr> tags, kinda straightened out allot of the mistakes. Now The header will not show up on the page. The page is an one time offer with 45 + products, so the page is quite long and it has 3 images that it uses for the frame border. I had to add 1 in more than once to extend the page. I have in put a background image graphic and the table is white, at the bottom I have sometimes more sometimes less black area on each side of the frame that I cannot get to go away. I tried for some time to fix this, and to no avail. I would like to learn how to fix this problem, so I can move on to new ones, lol I have allot more pages to build.Again I Hope I posted in the right area. Thanks in advance hey guys, Just wanted to know if this is at all possible. I have php pages that create tables through html that show data from my database. I want to know if i added like a print button on the page then get whatever is in the table and sent it to a pdf file to print out for a user. are there any example anyone could post or if this is in anyway remotely possible Hi im new here, and im going to start off with a table related question what I am trying to do is have table with a image in the back ground, this I can do fine, the other thing I want to have with in that first table is another table (5 x 16) For some reason when i try this it will work as two table one after the other when table one has a image but works fine when there is no image, does any one have any ideas as to why this is happening. or type the code our for me to see where im going wrong Thanks for looking, 09ricardo23 HTML Code: <table border="0" cellpadding="0" cellspacing="0" width="600"> <tbody> <tr> <td rowspan="10"> <img src="images/blank-1.gif" width="27" height="1035" /> </td> <td> <img src="images/blank-2.gif" width="445" height="43" /> </td> <td> <img src="images/s-trip-logo.gif" width="128" height="43" alt="S-Trip!" /> </td> </tr> <tr> <td width="425px"> <a href="http://www.edgeacademy.ca"><img src="images/edge-logo.gif" alt="EDGE Academy" width="425" height="115" /></a> </td> </tr> <tr> <td width="425px"> <img src="images/travel-for-credit.gif" width="425" height="34" alt="Travel for Credit \ Costa Rica \ England & France" /> </td> </tr> <tr> <td> <img src="images/book-now.gif" alt="Book now and save up to $500" width="148" height="150" /> </td> </tr> </tbody> </table> this is what it's producing: http://imageshack.us/photo/my-images...104at123t.png/ I'm trying to get the "book now and save" .gif to go up beside the EDGE logo. I'm a newbie at tables and am frustrated at this. When I "inspect element" the logo's <td> is saying the width is 445px when the width in the html is 425px. I am trying to create a HTML table with 1 row and 2 columns. Each column contains an already made table. I want to be able to scroll both columns down together but only scroll the right one across. I have attempted to do this with the following code: <div style=' height:500px; width:screen.width; overflow-y:scroll; overflow-x:hidden'><table> <tr> <td>".$left_column_table."</td> <td > <div style=' width:screen.width-200px; height: 500px; overflow-x:scroll; overflow-y:hidden'>". $right_column_table."</div> </td> </tr> </table> </div> The problem with this code is that the horizontal scroll bar isn't visible if the vertical scroll bar is scrolled up. How do I make the horizontal scroll bar stay on top so that it is always visible? I create html pages for my small business, and I am experiencing great frustrations. I am creating a calendar, and I have tried restricting the cell widths to specific px and % sizes and have tried the same in using style attributes, but nothing I try will prevent the cell from expanding with the text and distorting the calendar format. Is there a way to absolutely restrict the width of a column/cell in a table? Hi, I'm trying to include one HTML file in another. I tried iframe and was displeased with the results, I want the size of the frame to change dynamically and not just scroll. Fair warning, my knowledge of JavaScript is non-existent >_> . Basically, I have a document written in HTML (please don't suggest a wholesale re-write, that's simply not practical) and the idea is to have one file where it makes sense to include it several times. One thing to mention, this document is not meant to be shown on a web-server, but in a browser while you're reading it off your hard-drive. Here's what I have so far. main.shtml Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>test</title> </head> <body> <center> <h1> This is only a test! </h1> </center> <p> Still testing!!!!! </p> <!-- #include file="included.html" --> <p> Even more testing!!!!! </p> </body> </html> included.html Code: <!--<html> <head> <title> asdfasdfasdfasd </title> </head> <body>--> <p> <h4> foobar </h4> <br> <br> <br> <br> <h4> boofar </h4> </p> <!--</body> </html>--> Not sure what I'm doing wrong, help appreciated! Ok guys, here is my problem. I want to start off first by saying I know tableless layouts are the way to go. With that said I inherited this site and only have to add some functionality. The problem is if you look at http://innonmainmanasquan.com/test/rates-302a.php in IE there is separations in the table, I have edited till I am blue in the face and have no Idea why it is doing this. FF displays it just fine. I have been trying to figure this out for the past 8 hours and still no dice. The code is below if someone could at least point me in the right direction that would be awsome. HTML Code: <html> <head> <title>Inn On Main Manasquan - A Unique Jersey Shore Bed And Breakfast</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="style.css" rel="stylesheet" type="text/css"> <style type="text/css"> <!-- .style5 {color: #FFFFFF} --> </style> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <?php $page = "rooms"; $room = "302"; include('get.info.php'); ?> <div class="main"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr valign="top"> <td align="center"> <table id="Table_01" width="762" height="551" border="0" cellpadding="0" cellspacing="0"> <tr valign="top"> <td> <a href="index.php"><img src="images/Manasquan-Inn-Logo.gif" width="412" height="54" alt="home" border="0"></a></td> <td colspan="4" background="images/Jersey-Shore-Nav-Background.jpg" valign="middle"><div class="nav"><a href="location-north.php">Location</a> | <a href="accommodation.php">Rooms</a> | <a href="reservation.php">Reservations</a></div></td> </tr> <tr valign="top"> <td colspan="5"> <img src="images/Jersey-Bed-Breakfast-Establ.gif" width="762" height="25" alt=""></td> </tr> <tr valign="top"> <td width="762" height="259" colspan="5" valign="top"> <!-------------INSERTION HERE-------------> <table id="Table_02" border="0" cellpadding="0" cellspacing="0"> <tr valign="top"> <td> <img src="rooms/images/room_302-1_01.png" width="410" height="259" usemap="#Map" border="0"/> <map id="_Map" name="Map"> <area shape="rect" coords="281,210,307,235" href="rates-302a.php" alt="Image 1" title="Image 1" /> <area shape="rect" coords="312,209,336,236" href="rates-302b.php" alt="Image 2" title="Image 2" /> </map> </td> <td background="rooms/images/room_302-1_02.gif" width="352" height="259"> <div class="center7"> <p> <span class="style5"> <strong> Room 302 </strong> <br> </span> <?php echo stripslashes($returned['description']); ?> <br /> <b> <center> <?php echo stripslashes($returned['cost']); ?> </center> <br /> <center> <i> Click link for availability and best rates. </i> </center> <center> <a href="http://www.webervations.com/magic-scripts/resbook.asp?memberid=richjo" target="_blank"> <u> Check Availability </u> </a> </center> </b> </p> </div> <div class="center8"> <center> <strong> <u> Rooms </u> </strong> <br> <!--------------ROOM LINKS BELOW-------------> <a href="rates-201.php">201</a> - <a href="rates-202.php">202</a> - <a href="rates-203.php">203</a> - <a href="rates-204.php">204</a> - <a href="rates-205.php">205</a> - <a href="rates-206.php">206</a> <br> <a href="rates-207.php">207</a> - <a href="rates-301.php">301</a> - <a href="rates-302a.php">302</a> - <a href="rates-303.php">303</a> - <a href="rates-304.php">304</a> - <a href="rates-305.php">305</a> </center> </div> </td> </tr> </table> <!--INSERTION OVER------> </td> </tr> <tr valign="top"> <td colspan="5"> <img src="images/Jersey-Shore-Inn-Bottom.gif" width="762" height="25"></td> </tr> <tr valign="top"> <td colspan="2" background="images/Bottom-Left.gif" width="762" height="187" valign="top"><div class="bottom"> <div align="center"><img src="images/inn_facade.jpg" width="190" height="106" border="1"><br> <?php $query="SELECT * FROM bottomhome"; $result = mysql_query($query) or die(mysql_error()); $resultarray = mysql_fetch_assoc($result); echo stripslashes($resultarray['artist']); ?></div> </div></td> <td colspan="3" background="images/Bed-Breakfast-Manasquan.gif" width="289" height="187" valign="top"><div class="bottom"><img src="images/Inn-On-Main-Bed.jpg" width="130" height="106" hspace="10" vspace="5" align="left"><strong>Our Rooms </strong><br></span> <?php $query="SELECT * FROM bottomhome"; $result = mysql_query($query) or die(mysql_error()); $resultarray = mysql_fetch_assoc($result); echo stripslashes($resultarray['rooms']); ?><br> <a href="inn-packages.php">Click Here for More Info »</a></div></td> </tr> <tr valign="top"> <td> <img src="images/spacer.gif" width="412" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="61" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="34" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="136" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="119" height="1" alt=""></td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="5"> <tr valign="top"> <td align="center"><span class="style4">Inn On Main - 152 Main Street - Manasquan, NJ - (732) 528-0099 - </span><a href="mailto:info@innonmainmanasquan.com"><span class="style4">info@innonmainmanasquan.com</span></a><br> <br><a href="http://www.tripadvisor.com/"><img src="http://www.tripadvisor.com/img/triplogo162w.gif" border="0" alt="TripAdvisor.com"></a> <span class="bottom"><br> Read unbiased opinions about <a href="http://www.tripadvisor.com/">hotels</a> and <a href="http://www.tripadvisor.com/">vacations</a> at TripAdvisor.</span> <br> <img src='http://counter.dreamhost.com/cgi-bin/Count.cgi?df=jcnh74-countername.dat&pad=F&ft=0&dd=C&istrip=T'></td> </tr> </table></td> </tr> </table> </div> </body> </html> CSS Code: body { background-image: url(images/Inn-On-Main-Background.gif); font-family: "Times New Roman", Times, serif; font-size: 12px; overflow:hidden; } .main{ text-align: center; padding-top: 30px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; margin-bottom: 5px; overflow:hidden; } .main a:link{ color:#CCCCCC; text-decoration: none;overflow:hidden; } .main a:hover{ color: #999999; text-decoration: underline;overflow:hidden; } .main a:visited{ color:#CCCCCC; text-decoration: none;overflow:hidden; } .center{ color: #FFFFFF; padding: 0px; margin-top:10px; margin-left: 430px; font-size: 12px;overflow:hidden; } .packpic{ padding-top: 0px; padding-right: 0px; padding-bottom: 30px; padding-left: 0px; overflow:hidden; } .center2{ color: #FFFFFF; padding: 5px 20px 20px; margin-left: 480px; vertical-align: top; text-align: center; font-size: 12px; overflow:hidden; } .center3{ color: #FFFFFF; padding: 20px; margin-left: 480px; vertical-align: top; text-align: center; font-size: 12px; overflow:hidden; } .center4{ color: #FFFFFF; padding: 0px 20px; margin-left: 480px; vertical-align: top; text-align: center; font-size: 12px; overflow:hidden; } .center7{ color: #FFFFFF; padding: 0px; margin-left:10px; font-size: 12px; overflow:hidden; } .center8{ color: #FFFFFF; padding: 0px; margin-left: 100px; font-size: 12px; overflow:hidden; } .center6{ color: #FFFFFF; padding: -9px 20px -5px; margin-left: 480px; vertical-align: top; text-align: center; font-size: 12px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; overflow:hidden; } .nav{ color: #FFFFFF; text-align: center; padding: 5px; overflow:hidden; } .bottom { color: #082156; padding: 8px; font-size: 12px; overflow:hidden; } .bottom a:link{ color:#666666; text-decoration: none; overflow:hidden; } .bottom a:hover{ color:#666666; text-decoration: none; overflow:hidden; } .bottom a:visited{ color:#666666; text-decoration: none; overflow:hidden; } .style2 { font-size: 16px; font-weight: bold; overflow:hidden; } .style3 { font-size: 14px; font-weight: bold; overflow:hidden; } .style4 {color: #003366}.rates { color: #FFFFFF; padding: 80px 0px 0px; background-color: #666666; overflow:hidden; } .bg01 { background-image: url(images/innonmain_country.jpg); background-repeat: no-repeat; overflow:hidden; } .tbl{ width:762px; overflow:hidden; } Any help would be very much appreciated!!!!! Thanks All! Hello folks. I have this problem. I use a PHP script to echo many tables on one page. (I am posting this in the HTML forum as it requires HTML, not PHP knowledge! ). I use a class called stdDiv to get a border for the table. When I try and use <br />es and <spacer type="horizontal" size="10px" /> I do not get the effect I want. I wish for 10px between each table as described in the diagram below: However I do not get this and my table overlaps and is somehow displayed as if it is in the second row. What I get: Here is my code just for clarity: PHP Code: echo "<table class=\"stdDiv\" style=\"width:100%;\" > <colgroup><col width=\"33%\" /><col width=\"33%\" /><col width=\"33%\" /></colgroup> <tr><td colspan=\"3\" align=\"center\" class=\"title\" border=0>".$record['title']."</td></tr> <tr><td colspan=\"3\" align=\"center\" class=\"description\">".$record['description']."</td></tr> <tr><td colspan=\"3\" align=\"center\" ><img src=".$record['image']." style=\"width:128px; height:64px;\" /></td></tr> <tr><td class=\"text\" align=\"center\" style=\"border: 2px solid #999999\">Version: v".$record['version']."</td> <td class=\"text\" align=\"center\" style=\"border: 2px solid #999999\">Rating: ".$record['rating']."</td> <td class=\"text\" align=\"right\" style=\"border: 2px solid #999999\">by <b>".$record['creator']."</td></tr> </table>"; This will give out a table and it is executed with every looping. I want to know how or what code to insert to create a gap of 10px between it and the next time I want to output a table Regards and thanks in advance, mintsmike Hey all, I am not even sure if this is possible, but I have wasted most of today trying to find out. Anyways, I am trying to create a very basic webpage (for local use) that will allow me to add records to a table that I can then come back to at a later date. Essentially, I want a mini spreadsheet in a HTML file. Is this possible? I know that I could do this using PHP, but I just want this for local use, so I do not want / need to upload it anywhere. Plus, I am not linking to any database, I am hoping just to have the table saved into the HTML file. I currently have a JS script that will add rows to my table (with predetermined information - not 100% what I am wanting), but once I close the window, that information is not saved. If anyone could at least point me in the right direction, that would be good (hopefully this all makes sense ) |