HTML - Client Side Formatting A Txt File To Be Displayed In Html
Hi everyone, my first post here!
I'm trying to develop a website to display weather. Its really quite simple; One computer runs some weather software which gets its data from a weather station, the weather software creates .jpg images of the data it receives and ftp's them every 60 seconds to a webserver that just has a simple html page displaying all of the 6 images on one page again refreshing every 60 seconds. This has been running for some time but I have recently been asked to include data from another computer that monitors tidal height. This computer also ftp's its data every 60 seconds to the same webserver but in a csv .txt file. I can display this txt file directly on the site in a iframe but its really badly formatted. What's the best way of formatting the data client side? I thought maybe with javascript, but its something I have never used before. thanks in advance, Nick Similar Tutorialshi im designing a we site by php i have a html form that collect some information from client an it has some script for hide or visible text box when user check a checkbox but when client run my page see a popup menu allowed blocked content.... i saw some site do this withou running this popup how can i do it? thanks I'm trying to make a small page that reads a CSV file (exported from excel) that gives me a list of my DVDs with an img that is a link to the file to start the movie. It actually works fine (needs some formatting tweaking), but as it is below, it lists the movies vertically (up & down). Anyone know how I can make it list them horizontally? For whatever reason I prefer it that way. Any help would be appreciated. I'm testing using IE btw. movies-test.html ===== <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title> Graphical list </title> </head> <body bgcolor=#C0C0C0> <object ID=data classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param nAme="DataURL" value="movies-test.csv"> <param nAme="UseHeader" value="true"> </object> <table CELLSPACING=25 datasrc='#data'> <tr> <td><center> <a href= <span datafld='location'> </span><img width=290 height=400 src=<span datafld='picture'></span> </a><br> <span datafld='name'> </span> <span datafld='time'></span> </center></td> </tr> </table> </body> </html> movies-test.csv ===== name,time,picture,location 8mm,123,C:/DVDs/images/8mm_cs.jpg,D:/8mm/video_ts/video_ts.ifo 12 Monkeys,131,C:/DVDs/images/12_monkeys_cs.jpg,E:/12_monkeys/video_ts/video_ts.ifo Thirteen Ghosts,91,C:/DVDs/images/13_ghosts_CS.jpg,E:/thirteen_ghosts/video_ts/video_ts.ifo 13th Warrior,102,C:/DVDs/images/13th_warrior_cs.jpg,D:/13th_warrior/video_ts/video_ts.ifo 16 Blocks,105,C:/DVDs/images/16_blocks_cs.jpg,H:/16_blocks/video_ts/video_ts.ifo Revised Hey, Sorry to trouble everyone but I am having a frustrating time trying to realign my sidebar (gadget/links) on my blog: You'll notice my blog will have three parts: The blog posts on the left The middle side bar (where the links should be) The right side bar (where my Twitter feed goes) If you scroll down to the bottom of the page you will notice that the middle and right side bars are moved down to the bottom of the page. They were fine earlier today. Now they seem to be navigating toward the bottom of the page? I can't figure out what I did wrong. I was wondering if someone could check out my blog's source code and see how to align the middle and right side bars better. Thanks so much for your time! Can I enable a user to load a .txt file into a textarea? I know the user can do this via cut and paste (from a local app), but loading the file from the user's disk would be better Thanks, JAS Hi My problems: Q1: I am getting data from mySQL to populate fields to generate a report in html. The report are in two pages. Sometimes page two comes into page one. is there a way we can force page two to be only in page two. Q2: If I am printing only 1 page report, is there a way to force print (without changing print setting to print) into one page. Thanks Siva Dont know if it is the right forum place I have html links on my web site. These links are to files. Recently when i clicked the link, the file "open / Save" dialogue appears, but now i receieve a page can not be displayed. Right click save as works i.E 7, What could be causing this Regards, Alan Hi, I need some clarification regarding HTML editors and how to display the data that is stored through HTML editors. This is the HTML editor we are using and the following image is the data (uploaded by the HTML editor) displayed in a PHP file. Editor: Displayed label: Please tell me how I can avoid displaying the HTML code in the labels and display the special characters instead. Thanks in advance, Ravi. Hi, Quite some time ago I was faced with putting a website together for the first time for a local community group (my wife nominated me!). Rather than tell you all what it contains and how it looks, it is probably easier for me to give you the link which is the Friends of Clifton Park based in South Yorkshire, UK. This website consists of eight html pages. The first is the index, second is the welcome page and the rest are linked pages via links on the left. On every of the "linked" pages, only the main body changes, with the exception of each link showing in Caps and link disabled. The problem I'm having is that every single one of the linked html pages are the same, except the displayed text. 90% is the page set-up. So my question is: Is it possible to "import" the required text information when a link is clicked on straight into the main body of ONE html page? btw, you'll notice that the page height isn't fixed, it expands depending on amount of information in it. I have tried IFRAME but don't really seem to be getting anywhere as I can't seem to make the height auto-adjust. A specified height value has to be entered for each "page". This is no good as more information will be needed to be put on. So basically what I am trying to do is: Keep the index.html Change the welcome.html to display the main page (graphics/images, etc) Import text into main body into the welcome.html page when a link is clicked on. Thus reducing the need of duplicate html pages and just having text files containing the main body text. The main reason for wanting to do this is a) stop all the duplication of page set-up in each html file, and b) make it easier for the guy that wants to add information where needed, straight into notepad (txt file) and upload it to the website. I hope all the above makes sense and if anyone requires further information, I will only be to happy to provide it! Thank you. Hi, I made a webpage using dreamweaver 8. When i preview the page in firefox it has not problems in design layout of the page but when i view it in IE it breaks the design format and is messed up. Can anyone guide me as to why it would do it and how i can fix it? Also, when i try to display some text in Chinese, it shows random characters. I changed the fonts in internet options to display Chinese but it didn't work. I have viewed Chinese websites and they i didn't have any problem in seeing the text. Any reason or suggestion as to why it would do this? I would really appreciate any help on this, Thanks, Hi, I have an unusual problem. I am linking pages for my website, and I am sure that I have the formatting correct, but for some reason, when I reference my page (which is in a different directory) from a page within my root web folder, the formatting is gone. I am currently using simple html. My reference is as follows from my page within the root directory: <a href="/directory/directory/page.html">Text</a> The page works perfectly fine when it is in the root directory, but as soon as I move it to the other directory "/directory/directory" the background color and header formatting are gone. I still have my tables in place, but everything else is messed up. Ideas? Help? Hi all, I've been scouring the net for the past week+ looking for proper techniques to format a site using div tags. I found loads of general information, but nothing practical for me. I'm really not html savvy by any means and I used absolute position div tags to put this page together. I would love to know the proper way of formattting a site. To view the page and source code, you're welcome to take a look he http://tbsnyder.com/siteSetup Basically, what it is, is a huge section of AP div's and then a section of the div id's displaying all of the text/images, etc. For every div tag defined in css, there is the text/images that go with it underneath. I'm sure this is the wrong way to format a site, but it's the only way I know how to since I don't know html very well. If it would be easier to view by having the site on your desktop, I could upload a zip containing everything I would really appreciate any assistance that anyone could give me. edit: something I forgot to add is that one of the reasons I would like to properly format this page is to allow the content to auto-center as the user drags the browser window open. Right now, everything is stationary due to the AP div tags...I tried a few solutions, but everything seems to get overridden by the AP div's. I know CSS is useful for many many things. But I am trying to optimize my website as i'm designing, that way I don't have a giant project once i'm done. Here is my question: What would have a faster load time: Code: <html> <head> <LINK REL=StyleSheet HREF="style.css" TYPE="text/css" MEDIA=screen> <title></title> </head> <body> <div id=bold>Hello!</div> </body> </html> or: Code: <html> <head> <title></title> </head> <body> <b>Hello!</b> </body> </html> Ok.... I know this is my first post, and I wasn't quite sure where to post this, under html or scripting, but here goes. I run a website wherein I provide translations for Spanish lyrics. My layout is fairly straightforward, but I spend about 3/4 of my time formatting. Check out the following: http://thelandofoz.us/laposadadelosmuertos.html I have to insert all of my code by hand. My question is, is there anything that I can do to streamline this process? Is there perhaps a way to use a script to dynamically generate code like this from a plaintext file? When I do one of these pages, I usually copy the lyrics verse by verse, then translate them verse by verse like this: Alza tu cerveza, brinda por la libertad, bebe y vente de fiesta, pues el Infierno es este bar. Raise your beer, toast to freedom, drink and come to the party, for hell is this bar. SO... is there any way to make this easier on me? Hi, I added a rich text editor into my html page for text area fields, let us say description field. The user enters the text, modify its color, changes its size and fonts... The value saved for this field in the database is: <font color="#ff00ff">description text </font> and is showing as it is on the screen. If I look at the source code of the page, I notice the following: <font color="#ff00ff">description text </font> The problem is that, there are two conversions happening: < Converted To < > Converted To > How should I avoid this conversion so that the description text appears in its right format taking into consideration the html tags. Note: in the head of the page, I have the following: <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> I would appreciate any help. Best Regards, Lara I am trying to use a google custom search box on a website that I am making and I'm trying to integrate it nicely into the header. No matter what I try though, I can't seem to get the form box to sit in the center of the cell! I have tried formatting the form field, the form itself, the cell, and I haven't found any way to get it to line up with the text. Any insight would be appreciated http://kristybrandon.freehostia.com Hi All, Here is a small html file I have written. This is not formatting correctly in browser. Width is not recognised by browser. Thanks in advance for your help. Regards, Pratap Tripathy ---------------------------------- <html> <head> <TITLE>Analytical Method Report</TITLE> </head> <body> <center><p><b><u>Analytical Method Report</u></b></p></center> <table border=1 width="700px"> <tr> <td width="10px"> </td> <td width="80px">Method</td> <td width="10px">:</td> <td width="500px">11111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111222222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222223333333333333333333333333333333333333333333333 3333333333334444444444444444444444444444444444444444444444444444444455555555555555555555555555555555 55555555555555<</td> </tr> </table> </html> ---------------------------------- Below is my simple table from a more complex table. The issue I am having is the first <td></td> is variable height. In my second <td></td>, "abc" should be at the top in that <td> and "def" should be at the bottom in that <td>, leaving some <void> space in the middle which will shrink or grow based on the first <td> height. Any tag(s) can be used inside is the second <td></td> Any suggestions? Thanks Code: <table> <tr> <td><br><br><br><br><br><br><br><br></td> </tr> <tr> <td> abc def </td> </tr> </table> Hello I am a newbie in html. I was asked to design a html web page that includes cliend side validation for an entry form. my design is as below: <table width="75%" border="3" cellspacing="0" cellpadding="8"> <tr> <td><font color="#000000">Please fill in all the required fields </font></td> </tr> <tr> <form name="register" action=""> <td width="25%" bgcolor="#CCCCCC" colspan="2"> <p>First Name<br> <input type="text" name="textfield" width="200%"> </p> <p>Last Name<br> <input type="text" name="textfield" width="200%"> </p> <p>Username<br> <input type="text" name="textfield" width="200%"> </p> <p>Password<br> <input type="password" name="textfield2" width="200%"> </p> <p>Email<br> <input name="textfield" type="text" value="" width="200%"> </p> <p><input name="" type="checkbox" accesskey=""> I am happy to be Emailed </p> <p> <input type="submit" name="Submit" value="Submit" > </p></td> </form> </tr> </table> How can I validate it? should i use java?php or ...? thanks Okay, so the title...I didn't really know what to put. I'm having serious issues trying to find/alter a string of code on my site. It is currently in a box along the side with a show/hide button to make it retract and expand, but its default is open which is rather annoying. I really hope this is HTML and not Javascript, but I'm a complete newb when it comes to programming so I'm honestly clueless. HERE is a link to my site, if you want to see exactly what I'm talking about. As for the code, I don't know where the specific problem is, so I'm sorry for this, but I'm going to paste most of the header. Code: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".sideb").click(function(){ $(".cbox").slideToggle("slow"); }); }); </script> <script type="text/javascript"> $(document).ready(function(){ $('div.accordionButton').click(function() { if($(this).next().is(':visible')) { $('div.accordionContent').slideUp('slow'); } else { $('div.accordionContent').slideUp('slow'); $(this).next().slideDown('slow'); } }); $("div.accordioncontent").hide(); }); </script> <script type="text/javascript"> $(document).ready(function(){ $("div.accordionbutton").mouseover(function(){ $(this).removeClass().addClass("acchover"); }).mouseout(function(){ $(this).removeClass().addClass("accordionbutton"); }); </script> <style type="text/css"> body { background-position: top center; margin-left: 225px; } input, textarea, select { background-color: #f4f7f9; border: 1px solid #f4f7f9; font-family: verdana; color: #727f85; } .menubg { height: 30px; } .menubg a { padding: 2px 4px 2px 4px; text-align: center; font-family: helvetica; font-weight: 100!important; text-shadow: #c3cdd4 1px 1px 0px; text-transform: uppercase; letter-spacing: -1; font-size: 15px; text-decoration: none!important; color: #374a6c!important; } .menubg a:hover { color: #6b7fa2!important; text-decoration: none!important; background-color: transparent!important; } a:hover, a:active { background-color: #cdd8de; text-decoration: none; } .catbg { border-bottom: 5px solid #21314d; text-align: right; text-shadow: #21314d 1px 1px 0px; font-family: helvetica neue; font-weight: 100!important; background: url(GRADIENT URL HERE); } .cattext { font-weight: 100!important; text-transform: uppercase; padding-right: 20px; margin-top: 5px; } .titlebg { border-top: 5px solid #21314d; font-family: helvetica neue; text-transform: uppercase; padding-left: 6px; font-weight: 100!important; text-shadow: #21304c 1px 1px 0px; } .titletext { font-weight: 100!important; } .titletext { color: #404040!important; } .button { margin-left: 2px; margin-right: 2px; font-size: 9px!important; text-transform: lowercase!important; padding-right: 4px; } .sideb { background-color: #d8e1e6; display: block; color: #8a96ac; font-family: helvetica neue; font-width: 100!important; text-transform: uppercase; letter-spacing: 1px; padding: 2 2 2 5; font-size: 11px; margin-bottom: 1px; text-decoration: none!important; } a.sideb { background-color: #d8e1e6; display: block; color: #8a96ac; font-family: helvetica neue; font-width: 100!important; text-transform: uppercase; letter-spacing: 1px; padding: 2 2 2 5; font-size: 11px; margin-top: 1px; text-decoration: none!important; } a.sideb:hover, a.sideb:active { background-color: #97abb6; color: #eff3f5; text-transform: lowercase; padding: 2 2 2 5; } div.accordionButton { background-color: #d8e1e6; display: block; color: #8a96ac; font-family: helvetica neue; font-width: 100!important; text-transform: uppercase; letter-spacing: 1px; padding: 0; font-size: 11px; margin-top: 1px; text-decoration: none!important; } a.accordionButton { background-color: #d8e1e6; display: block; color: #8a96ac; font-family: helvetica neue; font-width: 100!important; text-transform: uppercase; letter-spacing: 1px; padding: 5; font-size: 11px; margin-top: 1px; text-decoration: none!important; } a.accordionButton:hover, a.accordionButton:active { background-color: #97abb6; color: #eff3f5; text-transform: lowercase; } a.side:link, a.side:visited { background-color: #d8e1e6; display: block; color: #8a96ac; font-family: helvetica neue; font-width: 100!important; text-transform: uppercase; letter-spacing: 1px; padding: 3; font-size: 11px; margin-bottom: 1px; text-decoration: none!important; } a.side:hover, a.side:active { background-color: #97abb6; color: #eff3f5; text-transform: lowercase; padding: 2 2 2 5; } h3.aegis { display: block; width: 98%; font-family: helvetica neue; font-weight: 100!important; font-size: 18px; letter-spacing: 0px; text-transform: uppercase; text-shadow: #34466a 1px 1px 0px; color: #bcc3cd; text-align: left; background-color: #18253f; margin: 20px 0px 0px -6px; padding: 5px; opacity: 0.8; -moz-opacity: 0.8; } h4.aegism { display: block; width: 98%; font-family: helvetica neue; font-weight: 100!important; font-size: 18px; letter-spacing: 0px; text-transform: uppercase; text-shadow: #34466a 1px 1px 0px; color: #bcc3cd; text-align: left; background-color: #18253f; margin: 0px 0px 0px -6px; padding: 5px; opacity: 0.8; -moz-opacity: 0.8; } .content { background: url("SIDEBAR BG MAIN URL HERE (LIGHT BLUE)"); text-align: justify; padding: 4 6 4 6; font-size: 10px; color: #57636a; margin-top: 0px; } p.update { background-color: #dddddd; border-bottom: 3px solid #ababab; text-align: justify; padding: 4 6 4 6; font-size: 10px; margin-top: 0px; } p.roma { background-color: #eff3f5; width: 80%; text-align: justify; padding: 8px; font-size: 10px; color: #6f797f; -moz-opacity: 0.8; opacity: 0.8; margin-top: 10px; margin-bottom: 0px; } p.maintext2 { background-color: #c6cfd4; text-align: center; font-size: 10px; color: #6f797f; -moz-opacity: 0.6; opacity:0.6; margin-top: 0px; } .transimage { float: left; margin-right: 4px; border: 3px solid #4a5a71; width: 80px; height: 80px; -moz-opacity: 0.8; opacity:0.8; } #sidetables { margin-left: 13px; width: 230px; border-left: 5px solid #18253f; border-right: 5px solid #18253f; border-bottom: 5px solid #18253f; } p.slide { background-color: #d8e1e6; display: block; color: #8a96ac; font-family: helvetica neue; font-width: 100!important; text-transform: uppercase; letter-spacing: 1px; padding: 2 2 2 5; font-size: 11px; margin-bottom: 2px; margin-top: 2px; text-decoration: none!important; } div.accordioncontent { display: none; } .acc { background-color: #eff3f5; width: 80%; text-align: justify; padding: 8px; font-size: 10px; color: #6f797f; -moz-opacity: 0.8; opacity: 0.8; margin-top: 2px; margin-bottom: 0px; } div.cbox { background-color: #eff3f5; padding: 8px; -moz-opacity: 0.8; opacity: 0.8; margin-top: 2px; margin-bottom: 0px; } .bordercolor { padding: 5; } </style> <script type="text/javascript"> <!-- /* fix text menus by ross */ var startChar = ''; //Start character var dividerChar = ''; //Dividing Character(s); var endChar = ''; //End character //no need to edit below var menu = document.getElementsByTagName('td').item(5).firstChild; var a = menu.innerHTML.replace(/^\n?(<.+?>)\[/, startChar+' $1'); var b = a.replace(new RegExp('\\](<\/a>)(\\n|\\s|&nb'+'sp;)*$', 'i'), '$1 '+endChar); var c = b.replace(new RegExp('\\](<\/a>)(&nb'+'sp;|\\s)(<a.+?>)\\[', 'gi'),'$1 '+dividerChar+' $3'); menu.innerHTML = c; //--> </script> <!-- ===== START Smangii's {LEFT} Side Tables *REVISED* Global Header ===== --> <table align="center" cellpadding="0px" cellspacing="0px"> <tr> <td vAlign="top"> <div style="position: fixed; left: 0px; top: 0px; width: 258px; height: 845px; background: url(SIDEBAR BG URL (DARK BLUE) HERE); color: #202e4c; border-right: 4px solid #78839b;"> <!-- ===== SIDEBAR ===== --> <table id="sidetables" cellpadding="0px" cellspacing="0"> <tr style="margin-top: 200px"><td class="iro" align="center"><div class="content"><br> <h3 class="aegis">cbox</h3> <center><br><a href="javascript:void(0);" class="sideb">click to hide/show</a> <div class="cbox"> <!-- BEGIN CBOX - www.cbox.ws - v001 --> <div id="cboxdiv" style="text-align: left; line-height: 0"> <div><iframe frameborder="0" width="200" height="245" src="http://www3.cbox.ws/box/?boxid=3366059&boxtag=rkhyky&sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain3-3366059" style="border: 0px solid;" id="cboxmain3-3366059"></iframe></div> <Cbox here> </div> <!-- END CBOX --> </div></center> I really hope someone could help me with this ^^; please and thank you very much. Alteast, I think it's a HTML website i'm reading from: http://nw4.novaworld.net/bhd_3_list.lob?page=2 I'm quite lost here, I tried several things, done some searching here and there, and just cant figure it out. I'm not sure if what I want is possible with HTML, if it isnt, please move this post to the appropriate section, thanks. What I want to do is make somesort of a 'Serverstatus block', with some help from the website I posted above. I sometimes host a server in that game, and then it shows up on that website with Game Name, Gametype and Players. Now I want to format that info into a nice statusblock... Though it's not just me hosting a server, there's more people hosting for the same name. I only want that statusblock to get the info only if there's a server with Game Name that contains 'P4F', else it should say 'Server Offline'. I want the info formatted like: Server Name: (namehere) Gametype: (gametypehere) Players: (playershere) I just cant figure this out... I do have some basic HTML knowledge, I know how to format text like that, but I dont know how to read from that website... Could anyone give me an example, tip or website that holds the easiest way to do this ? Thanks in advance, VipleX |