HTML - Webpage With Background Map And Foreground Textfields
Hi all,
I am trying to create a webpage, which would have a world map as the background (I am imagining an SVG file could do it) and in the foregroung there would be multiple textboxes, that would be fillable by the user. The values from the textboxes would be stored on the server, but that is the second step (for which I dont bother right now), most likely done through some PHP. The webpage should be a re-creation of a gameboard - namely Twilight Struggle. For an example (taken out of an Excel file calculator for this game) please see this: Could someone point me in a direction, which I could take in the general design part? E.g. SVG+textarea or something completely different? Similar Tutorialscan someone outline the steps to making a page with a fixed background and a scrolling foreground such as can be found here? http://www.paul-wallas.co.uk/ i've looked at the code and what information i've found on the web but i don't see how it is done. tia, I'm editing a tumblr, with complete custom HTML, and I was wondering how I'd either add one fixed white rectangle going down the page vertically (the posts are centered on the page, but the page background is too distracting from the posts themselves). Or, how I would just add white borders around each individual post? This should explain the look I want (with different colors/ background/ etc) Hi, I am VERY new to web development and I am making a page for my friend. Here's what I am trying to do, I want to use an image that is about 500 pixels high for the background of my page, and then whenever the text grows past that 500 pixels I want to start tiling a different image. Right now i'm just using a table and I have the image as the background. But as expected this just tiles that image over and over again. Is there a way to have it tile a different image without splitting the text up into two tables? Thanks! Evan Hello Thank you for reading my post. Just wondering, how do I get my background image to fit my webpage perfectly. Currently, its too big and can only see a corner. Nothing is happening when I try and reduce the width and length. I am using html and css I need it to fit perfectly <head> <style type="text/css" body {background-image:url("C:\Users\abigail\Desktop\tailor_fest1.jpg");width="1000"; height="712" </style> </head> Thanks Abby Hi All, I am working on a website and I want to have background music to my web-pages. How to add background music to pages that will play in loop. I have .mp3 file format which i want to play in loop as a background music to all pages. Thanks in advance. Hi All, I am working on a website and I want to have background music to my web-pages. How to add background music to pages that will play in loop. I have .mp3 file format which i want to play in loop as a background music to all pages. Thanks in advance. Hi Everyone- I was wondering if anyone has experienced the issue of fireworks generated dropdowns showing up behind form textfields. Is there any way to code around this? Thx its about the div menu and button1... Im not getting it Z-INDEX should work right? HTML Code: <title>Welcome - Homepage: As it is in heaven again</title> <style type="text/css"> <!-- body { background-color: #003366; background-image: url(afbeeldingen/ups_and_simulation.jpg); } a:link {color: #000000;} a:visited{color:#009;} a:hover {color: #000000;} .style1 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #003366; } .style9 { font-size: 18px; color: #330000; } .style18 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #330000; } .style32 { font-family: Verdana, Arial, Helvetica, sans-serif; color: #330000; font-size: 24px; } .style33 {font-size: 14px} .style35 {font-size: 24px} .style37 {font-size: 16px; color: #330000; } .style41 {font-size: 18px} div#blok1 { text-align: center; position:absolute; left: 207px; top: 208px; width: 482px; height: 25px; z-index: 1; } div#blok2 { text-align: center; position:absolute; font-size:16px; left: 214px; top: 301px; width: 461px; height: 181px; z-index:2; } div#swfje { position:absolute; top:304px; left:271px; z-index:4; width:330px; height:81px; z-index:2; } div#trailer { position:absolute; top:145px; left:133px; z-index:2; } div#container { position: relative; margin-left: -50%; background:url(afbeeldingen/basis2.jpg) top center no-repeat; width:900px; height:600px; text-align:center; margin:0 auto; z-index:0; } /* KNOPPEN NON-FLASH */ #menu { position:relative; top:138px; z-index:3; } #button1 { position:relative; width:150px; height:48px; left:295px; top:8px; background-image:url(two.png); background-repeat:no-repeat; z-index:1; } #button1:hover { background-position:0 -48px; z-index:1; } #ziel { position:relative; text-align:center; left:-72px; top:31px; width:600px; font-family:Verdana; z-index:3; } --> </style> *please bear with me this is a simple problem which is sort of hard to explain* I run a very small (15 page) website for myself. The site consists of an image_list page, which is an index of 13 thumbnail images. Each thumbnail links to a single page, each page being a larger image of the respective thumbnail. These 13 individual pages are directed at the same base target window, _ximage. you can find the image_list window he http://www.winslowsmith.com/work/index.html click on any one of these thumbnail links and a new window (_ximage) will open. navigate back to the image_list and click another link, the _ximage window will reload with the new page. Pretty simple, right?, just a <base target=""> command. In safari this all looks swell, and the _ximage window, whether open or not, will always come to the foreground to load. Not the case in Firefox. My problem in Firefox is as follows: opening one of the given links in image_list will load a new window (or tab), with _ximage target, and the first time, that new window/tab with _ximage target will come to focus and be in the foreground. However, if the viewer leaves the _ximage window open, and navigates back to the image_list window and clicks another link, that link will load appropriately but the _ximage window will remain in the background. (and it works the same whether you are using windows or tabs to load your new pages). This is frustrating because it forces the viewer to click twice rather than just once to get to one of these 13 pages, and said pages are the reason people would traffic to the site. Is there any way to have the links to base (_ximage) target always load in the foreground in Firefox(even when the target window _ximage is open)? Is there code to tell the Firefox browser, hey this is an important window load it in the foreground? Is there a way to do it with anchors? any help is appreciated Sorry if i posted this in the wrong location. So im a real estate agent making a website. Im no pro and most of the stuff ive been using to build has been through layouts/generators/help of others such as yourselves. So ive been stuck on finding/making this code for the past couple of days. So all my listings are on my agencys website, not my personal agent website. Is there a code i could have where in the listings page my my personal agent website, i could have a window maybe 600x900 of the listing page on my agencys website? To kind of clear things up, you know how when you google something you have the magnifying glass, how it gives that preview. How can i have that preview coded onto a webpage, but me say what webpage to preview and how big to make the preview box? Tried to explain it as best i could. If you dont know the code, if you can tell me what its called so i can try to narrow the google searches. So far everything that has been coming up in the search restults has been preview boxes to preview html codes you have already written. Fail Blog Thanks how do i make a background image fit to the window. also i have a button on a page. how do i get it to close the window uppon clicking it. any help would be great. I'm a novice compared to the pros here and stuck on a couple issues. My website is uspsrealty.com There is some "empty" space on my home page below the horizontal line. I want to remove the horizontal line and have the ability to use that empty space without throwing my borders/margins off. I would like to add about 3-4 sentences in that blank area. Can this be changed so I can add a few sentences? I know why this is happening, just don't know how to correct it. Also want to change the copyright.jpg to 2010 from 2009. Might as well make up a few more jpgs with the years 2011, 2012, 2013, 2014, and 2015 Willing to paypal you money for your help. Hoping one of you pros can do this in 30 min and willing to pay $25-30. Contact me he galevin@hotmail.com Thanks, Gerald Levin Hi, i have a problem im not sure how to go about it . I have a webpage where the user enters there personal details . As they are fillign in details they click a link and another webpage is opened ( keeping the orginal open ) Where the do some other stuff on this new page and what is created is a javascript array of numbers I then want them to be able close this new window down and the javascript array data will be submitted with the rest of the personal information when the click a submit button on the first page . If this makes sense how do i go about this? Thanks Hello, I remember something like this, which is you have an xhtml form, you have textboxes, buttons etc, then the user clicks on the submit button triggers the sendform feature element and sends it to the email address specified. How do you do that in html? i remember it was like send form, then the email address etc etc and anything between the send form tag is where it will email anything in the text box fields. if you can send me an example that would be great. Thanks I have a project right now, but when I have finished the project, i'm wanting to recreate my Minecraft server website. But I have a question... I see websites that resize theirselves depending on the screen size.... How would you do this? I know of the % in css, but would I have to use that in each of my divs instead of using px? I would like to get data from a specific website (http://www.forex.se/rates.asp?sectionId=246). More exactly, I want to get the values of the actual currencies and have them printed on my website. So for example, I would like to have it like this on my webpage: Code: Currency buy - sell EUR : 9,3749 - 9,6410 USD : 5,8674 - 6,0745 Thanks in advice. Okay that most probably didnt explain it very well but I am looking at putting a page together that will display a specific image at the top of the page dependant on where the visitor came from So if they came to my site from a link from abc.com then they will see the ABC logo on our page however if they came from 123.net then they will see the same page but this time with the 123.net logo. If we cant find where they have came from or we dont have an image for that forwarder then it will show a default image Anyone know if this can be done?? sorry, this isnt an exact repeat post... has a bit of additional information my friend had a friend make this page http://www.opportunity.com/index.html or something along those lines... Im using this page as a reference... So I copied the source, and copied the file free_access.css within the same folder I created an image subfolderd but when I preview it in dreamweaver it tells me it can not find the css file... Is this normal? do I need to upload it to a server first to actually view it... or am I making a mistake thx everyone for the help earlier Matt I have a website that when I type in the url nothing appears on the page. I was wondering what would cause this to happen. I tried to re-saving the files for the website but still nothing, it just says Done in the bottom tray of the IE window. Thanks in advance! Hi, I'm new to the site and I'm just here to ask a question. I've been having trouble with my webpage trying to center everything. The problem is that at home my webpage is centered (When you zoom out everything stays centered) but as for school I zoom out and everything stays to the left and I'm pretty sure I left all the code the same from computer to computer. I don't think it is the resolution because I had changed my resolution to the same as at school. This is my coding (I'm an amateur at Html and don't know CSS): <title>Home - WebBanners</title> </head> <p align="center"> <div style="position:absolute;top:0px; left:0px; right:0px; bottom:0px;" align="center"> <body topmargin="0" leftmargin="0" bgcolor="#0099FF"> <img src="Banner.gif" width="1280" height="290" border="0" usemap="#Map" /> <map name="Map" id="Map"> <area shape="rect" coords="140,233,302,285" href="Home.html" /> <area shape="rect" coords="330,233,543,286" href="Samples.html" /> <area shape="rect" coords="565,240,722,287" href="Prices.html" /> <area shape="rect" coords="752,229,905,286" href="About.html" /> <area shape="rect" coords="945,235,1122,284" href="Contact.html" /> </map> <font face="Georgia, Times New Roman, Times, serif" size="+4" color="white"><p align="center"> <u> Welcome To WebBanners!</u></p></font> </p> <table align="center"> <tr> <td><font face="Georgia, Times New Roman, Times, serif" color="black" size="7"><strong>H</strong></font> <font face="Georgia, Times New Roman, Times, serif" size="+2" color="white">ere we make special just-for-you banner. <br /> <br> <font face="Georgia, Times New Roman, Times, serif">Every banner is unique to the person who have ordered them.<br /> <br><font face="Georgia, Times New Roman, Times, serif">They are sold at a reasonable price and if you don't <br>like them then we offer full money back guaranteed. <br /> <br /> We also have an interactive department where you can <br />talk to one of 'us' through the microphone so we can help you. <br />All you have to do is ask through the E-mail. <br /> <br /> We can make tons of banners for your website such as the one above <br />or see more <a href="Samples.html">Here</a> <br /> <br /> We have prices for your special needs. <br />All of the banners we offer are your ideas. <br />Ask and we can do it for you! Click <a href="Prices.html"> Here </a> for prices. <br /> <br /> Want to learn more about us? Click <a href="About.html"> Here </a> for more information. <br /> <br /> Going to buy one of our offers? Need help in finding something? <br />Click <a href="Contact.html"> Here </a> to contact us! For your design! </font> </td> <td align="center"> <font face="Georgia, Times New Roman, Times, serif" color="Green" size="+3"><u><strong>So Why Pick Us? </font> </u> </strong> <br /> <br /> <font face="Georgia, Times New Roman, Times, serif" color="Green" size="+2"> <li>We have 100% Money Back Guarantee <br /> <li>Satisfaction Guarantee<br /> <li>Our Prices beat the Competitors<br /> <li>24 Hour Service <br /> <li>Interactive Department <br /> <br /> <br /> <br /> <img src="Ordernow!.gif" /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> </body> </html> |