How can I get my current content to slide to the left and bring in new content from the right (after clicking on button 1) when an existing student's username and password are correct, and if it's not correct display error messages that either the username or password isn't correct below each respective textbox .I am thinking about using an if/else condition. Also, how would I load the student's existing account information upon sliding it from the right, if I haven't created the content yet? If I already created the content to be slide in from the right, where do I hold that information until it's time to display that new content. Here is my code so far. - <html>
-
-
<head>
-
-
<link href="Home.css" rel="stylesheet" />
-
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
-
<title>Project</title>
-
-
</head>
-
-
<body>
-
-
-
<div class="container">
-
<div class="intro">
-
-
<h1>Welcome to Cuyahoga Community College Student Services Online</h1>
-
-
<p>Cuyahoga Community College recognizes students' rights to access personal and academic records in accordance with the Family Educational Rights and Privacy Act of 1974 (FERPA) as amended by Public Law 93-568.</p>
-
</div>
-
<br/>
-
-
<div class="content">
-
<div class="row top">
-
<p id="para1">Already have an account with us? Returning users may log in by entering their site username and password. </p>
-
<div class="login">
-
<label class="username-label" for="username-part1">Username</label>
-
<input class="existing1-username-input-textbox" type="text" value="" />
-
<br/><br/>
-
<label class="password-label" for="password-part2">Password</label>
-
<input class="existing2-password-input-textbox" type="password" value="" />
-
<br/>
-
<button id="button1">Log in</button>
-
</div>
-
</div>
-
<hr/>
-
<div class="row bottom">
-
<p id="para2">New users, please create a new account by providing us with some basic information.</p>
-
-
<div class= "new_customers_info">
-
-
<label class="Username-label1" for="new-user-name-part-1">Username</label>
-
<input class="username-new-input-textbox" type="text" value="" />
-
<br/><br/>
-
-
<label class="Password-label2" for="password-new-part2">Password</label>
-
<input class="password-new-input-textbox" type="password" value="" />
-
<br/><br/>
-
-
<label class="Email-label3" for="email-new">Email Address</label>
-
<input class="email-new-input-textbox" type="text" value=""/>
-
<br/><br/>
-
-
<label class="Repeat-Email-label4" for="repeat-new-email">Repeat Email Address</label>
-
<input class="reenter-new-input-textbox" type="text" value="" />
-
-
<button id="button2">Create Account</button>
-
</div>
-
</div>
-
</div>
-
<br/>
-
<footer>Cuyahoga Community College</footer>
-
<footer>700 Carnegie Avenue, Cleveland, Ohio, 44115</footer>
-
</div>
-
<script src="Home.js"></script>
-
</body>
-
</html>
- .intro h1 {
-
font-family: 'Cambria';
-
font-size: 16pt;
-
font: bold;
-
text-align: left;
-
}
-
-
.intro p {
-
font-family: 'Calibri';
-
font: italic;
-
font-size: 12pt;
-
padding: 0px 690px 0px 20px;
-
text-align: left;
-
}
-
-
.content {
-
border: 2px solid;
-
-webkit-border-radius: 10px;
-
-moz-border-radius: 10px;
-
border-radius: 10px;
-
}
-
-
#para1 {
-
padding: 0px 1050px 0px 20px;
-
}
-
-
#para2 {
-
padding: 0px 1099px 0px 20px;
-
}
-
-
.username-label,
-
.password-label {
-
margin: 10px 0px 0px 300px;
-
position: relative;
-
top: -70px;
-
}
-
-
.existing1-username-input-textbox,
-
.existing2-password-input-textbox
-
{
-
top: -70px;
-
position: relative;
-
-
}
-
-
#button1{
-
background-color: #add8e6;
-
margin-left: 390px;
-
position: relative;
-
top: -50px;
-
-webkit-border-radius: 10px;
-
-moz-border-radius: 10px;
-
border-radius:10px;
-
padding: 0px 20px 0px 20px;
-
}
-
-
#button2{
-
background-color: #add8e6;
-
margin-left: -200px;
-
position: relative;
-
top: -30px;
-
-webkit-border-radius: 10px;
-
-moz-border-radius: 10px;
-
border-radius: 10px;
-
padding: 0px 20px 0px 20px;
-
-
}
-
-
-
.Username-label1,
-
.Password-label2,
-
.Email-label3,
-
.Repeat-Email-label4
-
{
-
margin: 0px 0px 0px 300px;
-
position: relative;
-
top: -70px;
-
}
-
.username-new-input-textbox,
-
.password-new-input-textbox,
-
.email-new-input-textbox,
-
.reenter-new-input-textbox{
-
position: relative;
-
top: -70px;
-
margin-left: 20px;
-
-
}
-
-
document.getElementById("button1").onmouseover = function() {mouseOver1()};
-
-
document.getElementById("button1").onmouseout = function() {mouseOut1()};
-
-
function mouseOver1(){
-
-
document.getElementById("button1").style.color = "red";
-
}
-
-
function mouseOut1(){
-
-
document.getElementById("button1").style.color = "black";
-
}
-
-
-
-
document.getElementById("button2").onmouseover = function() {mouseOver()};
-
-
document.getElementById("button2").onmouseout = function() {mouseOut()};
-
-
function mouseOver(){
-
-
document.getElementById("button2").style.color = "purple";
-
}
-
-
function mouseOut(){
-
-
document.getElementById("button2").style.color = "black";
-
}
-
-
-
$("#button1").hover(function() {
-
$(this).css('cursor','pointer');
-
});
-
-
$("#button2").hover(function() {
-
$(this).css('cursor','pointer');
-
});
-
-
$(document).ready(function(){
-
$("#button1").click(function(){
-
-
if(username.value== "Micheal" && password.value== "honor7thG") {
-
-
$('#para1').hide("slide", {direction: "left" }, 1000);
-
$('.username-label').hide("slide", {direction: "left" }, 1000);
-
$('.existing1-username-input-textbox').hide("slide", {direction: "left" }, 1000);
-
$('.password-label').hide("slide", {direction: "left" }, 1000);
-
$('.existing2-password-input-textbox').hide("slide", {direction: "left" }, 1000);
-
-
$('').show("slide", { direction: "right" }, 1000);
-
-
0 33470 Sign in to post your reply or Sign up for a free account.
Similar topics |
by: Warren Post |
last post by:
Here's a problem I've never seen before. On
<http://snow.prohosting.com/srcopan/anti/>, should the viewport width be
less than the width of the page's header, then the right margin becomes
stuck at the viewport's right edge. This is perhaps better observed than
described; try it yourself at narrow viewport widths and/or high zoom
levels.
I am guessing that I've mucked up something in the CSS's margin
settings, but I can't find it by...
|
by: Mannequin* |
last post by:
Hi all,
I'm working on a quick program to bring the Bible into memory from a
text file. Anyway, I have three questions to ask.
First, is my implementation of malloc () correct in the program to
follow?
Second, have I correctly passed the structure's pointer to the
functions in this program?
|
by: Marty |
last post by:
Hi,
Can I animate the content of a picturebox? I mean, I have a static boat
picture that I inserted in a picture box, and I would like to
programmatically make some water wave around it.
Is there any tutorial of example of such a thing?
Thank you!
Marty
|
by: TN Bella |
last post by:
Hi,
I am trying to get my compare validator to fire properly...Since I have
panels the validator wouldn't work properly, the app would fire right
but would insert the data regardless and the user couldn't fix an error
if they had an error. So I added another sub and fixed the panels, but
the compare validator still doesn't work right.
Right now the validator pops up with the error that the two values
(txtAcctAmtSum and txtInvAmt) are...
|
by: wardy |
last post by:
I'm trying to undestand the impact of using content negotiation when
rendering my Web pages to various different browsers as I would like to
use the XHTML Strict DOCTYPE declaration. Reading the W3C guidelines,
if I render as 'text/html' then there are some backward compatibility
issues I need to worry about. Does this mean that the page must be
rendered in one way if I use the "application/xhmlt+xml" content type
and another if I use...
| |
by: Lawrence |
last post by:
Hi
I have only begun to look into ASP due to an assignments requirements
(I usually code in PHP), one feature in PHP is to be able to do an
if...else statement, where if a certain statement is true then a chunk
of HTML can be outputted...
Basically I want to be able to do this in ASP to use with a simple
authentication system which I will construct.
|
by: sam_cit |
last post by:
Hi,
I have the following Struct,
Struct Sample
{
int i;
char *p;
};
|
by: Ixiaus |
last post by:
I have just come across a site that discusses Python's 'for' and
'while' loops as having an (optional) 'else' structure.
At first glance I interpreted it as being a bit like the 'default'
structure in PHP's switch block... But the switch block isn't a loop,
so, I am now confused as to the reason for using 'else' with the for
and while loops...
A few quick tests basically show that statements in the else structure
are executed at the...
|
by: vesnianka |
last post by:
Hi! I was asked by a client to develop a web forum, in structure and content. My question is, how do I document the structure of a forum, for my client? Is it done as a site map? a mock-up? a diagram? Does anyone have a template that I can use, to customize how I would like the structure of the forum to look? Any ideas, pointers or professional recommendations? I am looking for formalize this process.
Thanks so much!
|
by: dantz |
last post by:
Hi,
Can someone please help me convert my C structure/function into C#? I really need this badly...
I believe I can call the DLL properly if I have able to correctly convert the function and marshal properly my structure.
Here is my struct and the function that uses it:
typedef struct UIclient_info {
char name;
int age;
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look !
Part I. Meaning of...
| |
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it.
Here is my compilation command:
g++-12 -std=c++20 -Wnarrowing bit_field.cpp
Here is the code in...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own....
Now, this would greatly impact the work of software developers. The idea...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert into image.
Globals.ThisAddIn.Application.ActiveDocument.Select();...
| |
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...
| |