#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2012
    Posts
    1
    Rep Power
    0

    Question Need help to combine CSS with Javascipt - Login form


    Hi,

    Am building a website - which will run on bunch of network computers.
    Practically new to Javascript and CSS and so been using available templates and code snippets to build this.

    I have a CSS code for the login box whichs is as below


    Code:
        
        <H2>Admin Login</H2>
        <br />
        <br />
        <div id="login-box-name" style="margin-top:20px;">Username:</div><div id="login-box-field" style="margin-top:20px;"><input name="q" class="form-login" title="Username" value="" size="30" maxlength="2048" /></div>
        <div id="login-box-name">Password:</div><div id="login-box-field"><input name="q" type="password" class="form-login" title="Password" value="" size="30" maxlength="2048" /></div>
        <br />
        <span class="login-box-options"><input type="checkbox" name="1" value="1"> Remember Me <a href="#" style="margin-left:30px;">Forgot password?</a></span>
        <br />
        <br />
        <a href="#"><img src="images/login-btn.png" width="103" height="42" style="margin-left:90px;" /></a>

    Now I have a simple javascript username/password script which I would like to combine (this owrks fine in its own way - but i would like to add the above css /PSD combination for login with this code below):

    Code:
        <script type="text/javascript">
        <!--
        if (location.search.indexOf("auth=failed") != -1) {
        	document.write("<span style=\"color:#ff0000\">Authorization Failed! Please Enter correct Details</span>");
        }
        // -->
        </script>
        <form id="form1" action="javascript://"
         onsubmit="return authPass(this.user.value,this.pass.value)">
          <table>
            <tbody>
              <tr>
                <td>Username: </td>
                <td><input name="user" type="text"></td>
              </tr>
              <tr>
                <td>Password: </td>
                <td><input name="pass" type="password"></td>
              </tr>
              <tr>
                <td colspan="2" align="center"><input
         value="Login" type="submit"></td>
              </tr>
            </tbody>
          </table>
        </form>


    Can anyone help me combine these two??

    Would be great help!

    Thanks
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2012
    Posts
    10
    Rep Power
    0
    html4strict Code:
    <script type="text/javascript">
    if(location.search.indexOf("auth=failed") != -1) {
    	document.write('<span style="color:#ff0000">Authorization Failed! Please Enter correct Details</span>');
    }
    </script>
    <h2>Admin Login</h2>
    <br /><br />
    <form id="form1" action="javascript://" onsubmit="return authPass(this.user.value,this.pass.value)">
    	<div id="login-box-name" style="margin-top:20px;">Username:</div>
    	<div id="login-box-field" style="margin-top:20px;"><input name="user" class="form-login" title="Username" size="30" maxlength="2048" /></div>
     
    	<div id="login-box-name">Password:</div>
    	<div id="login-box-field"><input name="pass" type="password" class="form-login" title="Password" size="30" maxlength="2048" /></div>
    	<br />
     
    	<span class="login-box-options"><input type="checkbox" name="1" value="1"> Remember Me <a href="#" style="margin-left:30px;">Forgot password?</a></span>
    	<br /><br />
     
    	<input type="image" src="images/login-btn.png" style="margin-left:90px;width:103px;height:42px" />
    </form>

IMN logo majestic logo threadwatch logo seochat tools logo