Please help me I need help in creating code for a web page to a fictitious event
ID: 3853490 • Letter: P
Question
Please help me I need help in creating code for a web page to a fictitious event. The page should provide all relevant information for the event. (i.e. what it is, purpose, where, when, etc.). Pictures and theming as appropriate for event. Provide the user with the ability to register for the event. Provide a confirmation of the registration along with appropriate information from the user’s registration. (i.e. first and last name, event, confirmation number, etc.) well I learned Html of course java Script,CSS. Can you do code for me. Can you check to make sure it works.
Explanation / Answer
Index.Html :
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.main-container{
background: #d53369; /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #d53369 , #cbad6d); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #d53369 , #cbad6d); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.highlight {
width: 600px;
color: white;
background: rgba(0, 0, 0, 0.26);
border-radius: 10px;
padding: 3%;
}
.highlight img {
float: left;
width: 100px;
height: 100px;
margin: 10px;
}
.highlight ul {
list-style-image: url('http://icons.iconarchive.com/icons/yusuke-kamiyamane/fugue/16/tick-small-icon.png');
margin-left: 1%;
float: left;
clear: right
}
.highlight button {
margin-left: 1%;
float: right;
}
.highlight h1,h2,h3,h4,h5,h6 {
padding-bottom: 2%;
border-bottom: 2px dashed rgba(255, 255, 255, 0.41);
font-size:20px;
text-align : center;
text-transform: uppercase;
}
.highlight p {
text-align: justify;
}
</style>
</head>
<body>
<div class="container">
<div class ="main-container">
<div class=" highlight">
<h2>Super Product Highlight</h2>
<div class="row">
<img src="http://davidnaylor.org/temp/thunderbird-logo-200x200.png" />
<ul>
<li>Demo Event</li>
</ul>
</div>
<div class="row">
<p>Morbi laoreet ipsum sem, eu condimentum ante efficitur vel.
Donec at nibh risus. Nam mollis nulla eget scelerisque facilisis.
Suspendisse sit amet condimentum dolor. Vestibulum euismod congue mi
pulvinar dignissim. </p>
<button class = "btn btn-primary" data-toggle="modal" data-target="#myModal">Buy Now</button>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body">
<form class="form-horizontal" >
<div class="form-group">
<label class="control-label col-sm-2" for="email">First Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="fName" placeholder="Enter First Name" name="fName">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="pwd">Last Name:</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="lName" placeholder="Enter Last Name" name="lName">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<script>
function regevent()
{
var firstPart = (Math.random() * 46656) | 0;
var secondPart = (Math.random() * 46656) | 0;
firstPart = ("000" + firstPart.toString(36)).slice(-3);
secondPart = ("000" + secondPart.toString(36)).slice(-3);
var name=document.getElementById("fName").value;
var lname=document.getElementById("lName").value
document.write("ConformationId :"+firstPart+secondPart);
document.write("FirstName : "+name)
document.write("LastName : "+lname);
}
</script>
</body>
</html>
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.