Melissa Posted April 27, 2006 Share Posted April 27, 2006 Hi,first of all i would like to say that i will appreciate any help that will be given to me, even though some of you professional web builders and programmers might laugh at the problems i got myself intoI am just a beginner as far as making websites, ive had some experience with some very basic html using frontpageMy problem is that i promised someone to make a webpage that includes a form, not knowing how complex this would turn out to be.. I thought i could just download a template and replace some of the questions on the form and edit and change it here and theresee, the form doesnt actually need to work, it will just be some sort of demoBut there are some things that also needs to be done that i just dont know how to do it...Ive tried to find the appropriate, understandable documentation on the web to fix my problem but the template i have downloaded comes with such enormous and complex coding, that i just dont know where to startIf anyone is willing to help, i would really appreciate it!What i need to do is the following:1) One of the questions on the form has a checkbox. When the box is checked, other questions need to appear which wont be seen when the box is not checked2) When pointing at a certain image with the mouse, an explanation needs to appear on the left side from the page. And it also needs to be floating on the same position since the form scrolls downI hope these two things can still be added on my templateAnd i apoligise if i posted in the incorrect forumAgain, any help is greatly appreciatedi would also be happy to send it over if someone is willing to take a look at itthanks in advance Link to comment Share on other sites More sharing options...
scott100 Posted April 27, 2006 Share Posted April 27, 2006 My problem is that i promised someone to make a webpage that includes a form, not knowing how complex this would turn out to be.. <{POST_SNAPBACK}> Lesson to be learned there 1)<head><script>function check(){if (document.getElementById("agree").checked)document.getElementById("mydiv").style.display="block";else document.getElementById("mydiv").style.display="none";}</script></head><body><form name="input" action="html_form_action.asp" method="post">Do you agree? <input type="checkbox" id="agree" onclick="check()" /><br /><br /><div id="mydiv" style="display:none">Your Name<input type="text" /><br />Your Address<input type="text" /></div></form></body> Link to comment Share on other sites More sharing options...
Melissa Posted April 28, 2006 Author Share Posted April 28, 2006 Scott,thanks aloti managed to do exactly the thing i want! (with a little puzzling)thanks alotnow i only need the second thing.. Link to comment Share on other sites More sharing options...
scott100 Posted April 28, 2006 Share Posted April 28, 2006 2) When pointing at a certain image with the mouse, an explanation needs to appear on the left side from the page. And it also needs to be floating on the same position since the form scrolls down<{POST_SNAPBACK}> 2) Text appears when over an image and is in a fixed position. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" ><head><title> CSS position:fixed; for IE6</title><style type="text/css">body {margin:0; padding:0 10px 0 10px; border:0; height:100%; overflow-y:auto;}body {font-family: georgia, serif; font-size:16px;}#menu {display:block; top:10px; left:50%; width:130px; position:fixed;}* html #menu {position:absolute;}</style><!--[if lte IE 6]> <style type="text/css"> /*<![CDATA[*/ html {overflow-x:auto; overflow-y:hidden;} /*]]>*/ </style><![endif]--></head><body style="overflow:none"><div id="menu"></div><img src="http://www.google.co.uk/intl/en_uk/images/logo.gif" onmouseover="menu.innerHTML='Hi, i am google'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://eur.i1.yimg.com/eur.yimg.com/i/eu/hp/yuk1.gif" onmouseover="menu.innerHTML='yahoo here, hello'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://www.google.co.uk/intl/en_uk/images/logo.gif" onmouseover="menu.innerHTML='Hi, i am google'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://eur.i1.yimg.com/eur.yimg.com/i/eu/hp/yuk1.gif" onmouseover="menu.innerHTML='yahoo here, hello'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://www.google.co.uk/intl/en_uk/images/logo.gif" onmouseover="menu.innerHTML='Hi, i am google'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://eur.i1.yimg.com/eur.yimg.com/i/eu/hp/yuk1.gif" onmouseover="menu.innerHTML='yahoo here, hello'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://www.google.co.uk/intl/en_uk/images/logo.gif" onmouseover="menu.innerHTML='Hi, i am google'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://eur.i1.yimg.com/eur.yimg.com/i/eu/hp/yuk1.gif" onmouseover="menu.innerHTML='yahoo here, hello'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://www.google.co.uk/intl/en_uk/images/logo.gif" onmouseover="menu.innerHTML='Hi, i am google'" onmouseoot="menu.innerHTML=''" /><br /><img src="http://eur.i1.yimg.com/eur.yimg.com/i/eu/hp/yuk1.gif" onmouseover="menu.innerHTML='yahoo here, hello'" onmouseoot="menu.innerHTML=''" /><br /></body></html> only checked with IE Link to comment Share on other sites More sharing options...
Melissa Posted May 3, 2006 Author Share Posted May 3, 2006 <head><script>function check(){if (document.getElementById("agree").checked)document.getElementById("mydiv").style.display="block";else document.getElementById("mydiv").style.display="none";}</script></head><body><form name="input" action="html_form_action.asp" method="post">Do you agree? <input type="checkbox" id="agree" onclick="check()" /><br /><br /><div id="mydiv" style="display:none">Your Name<input type="text" /><br />Your Address<input type="text" /></div></form></body> Scott,about that codewhat if i want two more collapsing questions like thati tried to copy and paste them right under them but that dont seem to work properlydo i need to label three different "mydiv" ?just a guess..thanks Link to comment Share on other sites More sharing options...
scott100 Posted May 3, 2006 Share Posted May 3, 2006 Yes you cannot use any id more than once on a page, you need to label them differentlydivs = mydiv1, mydiv2, mydiv3checkboxes = agree1, agree2, agree3I have used a loop to check if the checkboxes are checked then display the corresponding div. If you need to add any more just use mydiv4, mydiv5 etc and change the size of the loop i<=4, i<=5 etc <head><script>function check(){for(var i=1;i<=3;i++){if (document.getElementById("agree"+i).checked)document.getElementById("mydiv"+i).style.display="block";else {document.getElementById("mydiv"+i).style.display="none";}}}</script></head><body><form name="input" action="html_form_action.asp" method="post"><table border="0" width="100%"><tr><td width="33%" valign="top">Is it morning? <input type="checkbox" id="agree1" onclick="check()" /><br /><br /><div id="mydiv1" style="display:none">Breakfast: <input type="text" /></div></td><td width="33%" valign="top">Is it afternoon? <input type="checkbox" id="agree2" onclick="check()" /><br /><br /><div id="mydiv2" style="display:none">Lunch: <input type="text" /></div></td><td width="33%" valign="top">Is it evening? <input type="checkbox" id="agree3" onclick="check()" /><br /><br /><div id="mydiv3" style="display:none">Dinner: <input type="text" /></div></td></tr></table></form></body> Link to comment Share on other sites More sharing options...
Melissa Posted May 3, 2006 Author Share Posted May 3, 2006 again thanks Scottit workedi will look into the code for 'text appearing when over image and in a fixed position' later but im sure i will post again to get your help if needed! :)thanks! Link to comment Share on other sites More sharing options...
scott100 Posted May 3, 2006 Share Posted May 3, 2006 again thanks Scottit workedi will look into the code for 'text appearing when over image and in a fixed position' later but im sure i will post again to get your help if needed! :)thanks!<{POST_SNAPBACK}> No problem If you need any help with the other part then just give me a shout Link to comment Share on other sites More sharing options...
dooberry Posted May 3, 2006 Share Posted May 3, 2006 Hi,I'm probably butting in a bit here, but you could change the function call to include parameters which take the control id, and add an attribute to the control - like an section number: <input type="checkbox" id="check1" divsection="mydiv1" onclick="check(this.id, this.divsection)" /> Then change your function to: function check(checkboxid, divid){if (document.getElementById(checkboxid).checked)document.getElementById(divid).style.display="block";else {document.getElementById(divid).style.display="none"};} This also means that you don't have to change the number in the loop if you add new sections to the page.Sorry if that makes me seem like a smartarse, just offering some help. :)Dooberry. Link to comment Share on other sites More sharing options...
abyssXX Posted May 4, 2006 Share Posted May 4, 2006 a form and a fourm are 2 very different things...fourms easy the basicsjust incase u dont know <form><p>username:<input type="text" name="user"><br>password:<input type="text" name="password"><br>date of birth:<input type="number" name="DOB"></p><p>######:<input type="radio" name="######" value="male">male<br><input type="radio" name="######" value="female">female</p><p>i have passed in ECDL<br> <br>powerpoint <input type="checkbox" name="powerpoint"><br><br>excel <input type="checkbox" name="excel"><br><br>word <input type="checkbox" name="word"><br><br>database <input type="checkbox" name"database"><br><br>concepts of ict <input type="checkbox" name="COict"><br><br>internet <input type="checkbox" name="internet"></p><p> <select name="where_did_you_here_about_us?"> <option value="internet">internet</option> <option value="friend">friend</option> </select></p><input name="button" type="button" value="submit"></form> Link to comment Share on other sites More sharing options...
Starwon Posted May 4, 2006 Share Posted May 4, 2006 Hello im stuck im trying to get the onmouseover function to change the colour of text can anyone help? Link to comment Share on other sites More sharing options...
Nakor Posted May 4, 2006 Share Posted May 4, 2006 This is an<b onmouseout="this.style.color = 'black';" onmouseover="this.style.color = 'red';" align="justify"> example </b>of changing the color of text using a MouseOver. Link to comment Share on other sites More sharing options...
scott100 Posted May 4, 2006 Share Posted May 4, 2006 @abyssXX - what is that code for? what are you on about? @Starwon - Welcome to the forums, if you have a question to ask please create a new topic, not hijack another thread. thanks Link to comment Share on other sites More sharing options...
aspnetguy Posted May 4, 2006 Share Posted May 4, 2006 abyss do not post unrelated code. Your reply has nothing to do with the topic at hand. Next time you will get a warning. Thanks Link to comment Share on other sites More sharing options...
justsomeguy Posted May 5, 2006 Share Posted May 5, 2006 Also, I just have to ask.. a form and a fourm are 2 very different things...fourms easy the basicsWhat exactly is a "fourm"? I thought it was a misspelling of something else, but you used it twice. What are you talking about? Link to comment Share on other sites More sharing options...
Starwon Posted May 5, 2006 Share Posted May 5, 2006 @Starwon - Welcome to the forums, if you have a question to ask please create a new topic, not hijack another thread. thanks <{POST_SNAPBACK}> oh right sorry thought it was a general help page and thanks Nakor that worked Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now