Jump to content

Help on replacing of some elements with new element using the DOM scripting on my JOIN-PAGE


ubilli
 Share

Recommended Posts

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Join</title></head><body><div id=maincontainer><div id="head"></div><p id="usertxt"> Please to join click on one of the accounts that fits your proffesion.</p><div id="fatline"></div><div id="ceo" onmouseout="offbckg()" onmouseover="showbckg()" onclick="ceoform()"><p id="ceo_txt">C.E.O</p></div> <div id="staff" onmouseout="offbckg()" onmouseover="showbckg()" onclick="staffform()"><p id="staff_txt">Staff</p></div> <div id="student" onmouseout="offbckg()" onmouseover="showbckg()" onclick="ceoform()"><p id="student_txt">Student</p></div> <div id="infobox"><p id="ceoacc">C.E.O Account</p><p id="ceoinfo">The C.E.O account is an account that deals with people who have large business with branches nationwide or worldwide and are employers of Job/labour,and also who have large number of staff 100 and above.This account helps to link them to their staff,customers,business-partners,goverment-officials/organization that the C.E.O does business with.</p><p id="ceoacc">Staff Account</p><p id="ceoinfo">The Staff account is an account that deals with people who are employees in firm/establishments/organizations in various works of life.This account helps to link to their c.e.o,managers and other staff in their organization both national and international.other of the staff-self products can be sold here and more.</p><p id="ceoacc">Student Account</p><p id="ceoinfo">The Student account is an account that deals with people who are (18) years of age and are in a collegde/university (tetary instituation) who after school will become job-seekers,This platform help them to submit their credentials and and let Jobpal search help them do the search for their dream jobs.with Jobpal's platform they can also be Jobpal-lancers(Free-lancers).</p></div> <style type="text/css">#ceoinfo{color:#3CB3C3;font-size:25px;margin:5px;background-color:#e7f2f4;}#ceoacc{font-size:20px;background-color:#3CB3C3;text-align:center;color:white;font-family:"Lucida Console", Monaco, monospace;}#infobox{width:28cm;height:14cm;border:thin solid #3CB3C3;margin-top:-14.1cm;margin-left:6.5cm;}#fatline{width:0.5cm;height:20cm;border:thin solid #3CB3C3;margin-top:-0.7cm;margin-left:3px;background-color:#e7f2f4;}#usertxt{color:#3CB3C3;font-size:24px;font-family:Verdana, Geneva, sans-serif;text-decoration:underline;margin-left:10cm;}*{margin:0cm;}#head{width:auto;height:2cm;background-color:#3CB3C3;}#ceo,#staff,#student{width:5cm;height:2cm;background-color:#e7f2f4;border:thin solid #3CB3C3;margin-left:0.6cm;}#ceo{margin-top:-18cm;} #ceo:hover{border-left-width:0.5cm;border-left-color:#3CB3C3;} #staff{margin-top:4cm;} #staff:hover{border-left-width:0.5cm;border-left-color:#3CB3C3;}#student{margin-top:4cm;} #student:hover{border-left-width:0.5cm;border-left-color:#3CB3C3;} #ceo_txt,#staff_txt,#student_txt{font-size:30px;font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;color:#3CB3C3;text-align:center;margin-top:15px; } </style><script type="text/javascript">function showbckg(){var longline=document.getElementById("fatline").style;longline.backgroundColor="#3CB3C3"; }function offbckg(){var longline=document.getElementById("fatline").style;longline.backgroundColor="#e7f2f4"; }function ceoform(x,y){var delete_infobox=document.getElementById('infobox');var refstudent=document.getElementById('student');} </script></div></body></html>hello fellow web developers please i am writing my webapp but i have issues on this on my join page{register page} in the javascript section of the page i am actually using the DOM to remove the #infobox[div]element....now what i want to do is that i want a sitituation where by where my users click on the the three links the #infobox(id)and all its element are remove and replace with a set of div that is a form which the user will input their registration information in which i will ask them....now these i plan it to go... from the elements.............<div id="fatline"></div><div id="ceo" onmouseout="offbckg()" onmouseover="showbckg()" onclick="ceoform()"><p id="ceo_txt">C.E.O</p></div> <div id="staff" onmouseout="offbckg()" onmouseover="showbckg()" onclick="ceoform()"><p id="staff_txt">Staff</p></div> <div id="student" onmouseout="offbckg()" onmouseover="showbckg()" onclick="ceoform()"><p id="student_txt">Student</p></div>***********************************************************************************************the javascript section of the code...function ceoform(x,y){var delete_infobox=document.getElementById('infobox');var refstudent=document.getElementById('student');delete_infobox.parentNode.removeChild(delete_infobox);}but the problem is that after the elements in the #infobox are deleted.i try to use the document.createElement() function to add a new set of div element after the the info-box have been deleted but the new element are not showing in the browser is it that there some kind of control stucture i will use to create new element after the #infobox has been remove...please help...also please let me add this i want make a situation where by the before the form comes to the web-page like 5-7seconds a loading gif image will load befor the form display in the webpage how can i do that on javascript....

Link to comment
Share on other sites

ok dzhax i will check on it on my page...but i hope it will be cross browsers....thanks let me work on it ..

Link to comment
Share on other sites

All DOM commands are cross-browser if im not mistaken. you might have an issue with old versions of IE but you can act like all other websites and tell your user they may need to upgrade their browser to a newer version to gain full functionality of your site.

Link to comment
Share on other sites

please Dzhax i want to ask an odd question,please do you think i code a large web application cause sometimes i feel i cannot...

Link to comment
Share on other sites

Sometimes I feel the same way. What I normally do is take a break from the project for a day and work on something else to "Clear My Head". For instance, I have been slowly developing a CMS from scratch. I will work on a part of that when I get stressed with a primary project.

Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...