Hi,
I need some help in making the login like the daniweb...How am i going to do this that when i click the login it will show the div and the background will turns to gray.just like the daniweb...I am not quite good in javascript i am still studying on this...
Thank you in advance.
JemZ,
No point going into great detail here - someone has done a great review:
20+ ways to create javascript modal windows and dialog boxes
Airshow
JemZ,
No point going into great detail here - someone has done a great review:
20+ ways to create javascript modal windows and dialog boxes
Airshow
I tried..
JemZ,
No point going into great detail here - someone has done a great review:
20+ ways to create javascript modal windows and dialog boxes
Airshow
Hi,
Thank you for this...I already made the log-in form in separate file,but how can i connect this in my index file.
that when i click the login and it will show like the daniweb login form....
here is my index file
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<title>Home</title>
<body>
<div id="menu" class="Nav">
<ul>
<li><a href="index.php"><span>Home</span></a></li>
<li><a href="index.php?p_pge=about"><span>About</span></a></li>
<li><a href="index.php?p_pge=site"><span>Maps</span></a></li>
</ul>
</div>
<div id="log_in_div" class="log_in">
<ul>
<li><a href="login.php"><span>Log-in</span></a></li>
<li><a href="register.php"><span>Register</span></a></li>
</ul>
</div>
<div >
<?php
$pge = array(
'about' => 'about.php',
'contact' => 'contact.php',
'register' => 'register.php',
);
$p = 'home.php';
if(isset($_GET['p_pge']))
{
$p_pge = $_GET['p_pge'];
if(array_key_exists($p_pge,$pge))
$p = $pge[$p_pge];
}
include($p);
?>
</div>
</body>
</html>Here is my login.php
<html>
<head>
<title>Log-in</title>
<style type="text/css">
#outterdiv {
position:absolute;
width:100%;
height:100%;
opacity:0.5;
background:url('images/backui.png')repeat;
z-index:1000;
top:0;
left:0;
}
#innerdiv {
position:absolute;
border:solid 1px red;
top:222px;
left:350.5px;
display:block;
height:auto;
z-index:1002;
width:300px;
background:white;
}
</style>
</head>
<body>
<div id="outterdiv"></div>
<div id="innerdiv">
<div style="width:auto; height:auto;">
<form method="post">
<table border="1" align="center">
<tr>
<td><label>EMAIL</label></td>
<td><input type="text" name="txtname"></td>
</tr>
<tr>
<td><label>PASSWORD</label></td>
<td><input type="password" name="txtpwd"></td>
</tr>
<tr >
<td colspan="2" align="center"><input type="submit" value="Submit" name="submit">
</input>
<input type="reset" value="Reset">
</input></td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>Thank you in advance...I hope you can help me on this.
Best Regards!
Jemz,
If I understand correctly, your approach requires a round trip to the server to fetch page(s) containing the login/register forms, then (I assume) a second round trip when one or other of these forms is submitted.
For me the preferred approach is to serve the page (potentially any page in the site) with the login and register forms already on the page (hidden), conditional only on the user not being already logged in. Then show the login or register form (using a lightbox if you like) in response to the "login"|"register" buttons bing clicked. Response will be extremely rapid because there's no round trip to the server. You just need a small amount of javascript to establish click handlers for the two buttons, and possibly some css to hide the forms initially and to style things up.
Server-side, you can have an include file containing "login" and "register" HTML fragments (ie. two divs but no doctype/head/body), which is available to be included on any page.
With a bit of thought, and by writing a php control structure in the include file, you can display "login"|"register" buttons to users who are not logged in and "Hello Xxxxx"|"logout" to users who are logged in. This approach can be used for the initial page in a session (eg. with automatic, cookie-based login) and subsequent pages.
Airshow
Jemz,
If I understand correctly, your approach requires a round trip to the server to fetch page(s) containing the login/register forms, then (I assume) a second round trip when one or other of these forms is submitted.
For me the preferred approach is to serve the page (potentially any page in the site) with the login and register forms already on the page (hidden), conditional only on the user not being already logged in. Then show the login or register form (using a lightbox if you like) in response to the "login"|"register" buttons bing clicked. Response will be extremely rapid because there's no round trip to the server. You just need a small amount of javascript to establish click handlers for the two buttons, and possibly some css to hide the forms initially and to style things up.
Server-side, you can have an include file containing "login" and "register" HTML fragments (ie. two divs but no doctype/head/body), which is available to be included on any page.
With a bit of thought, and by writing a php control structure in the include file, you can display "login"|"register" buttons to users who are not logged in and "Hello Xxxxx"|"logout" to users who are logged in. This approach can be used for the initial page in a session (eg. with automatic, cookie-based login) and subsequent pages.
Airshow
Hi Airshow,
Thank you for the reply,....sir i am confuse...how do i use javascript click events?so that the user can click login and the login form will be shown...can you give me some example sir,i am still beginner in making the dynamic page....
Best Regards!
how do i use javascript click events?so that the user can click login and the login form will be shown...can you give me some example sir,i am still beginner in making the dynamic page....
That takes us straight back to my first answer to your original question.
Choose one of the 20+ ways to create javascript modal windows and dialog boxes. They are all documented (to a greater or lesser extent).
Airshow
That takes us straight back to my first answer to your original question.
Choose one of the 20+ ways to create javascript modal windows and dialog boxes. They are all documented (to a greater or lesser extent).
Airshow
But sir i have not seen the log in form example in the link that you gave to me...I apologize i really dont have idea.
Best Regardz,
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.