【移动应用开发技术】怎么用jQuery的Easyui实现登陆框界面_第1页
【移动应用开发技术】怎么用jQuery的Easyui实现登陆框界面_第2页
【移动应用开发技术】怎么用jQuery的Easyui实现登陆框界面_第3页
【移动应用开发技术】怎么用jQuery的Easyui实现登陆框界面_第4页
【移动应用开发技术】怎么用jQuery的Easyui实现登陆框界面_第5页
免费预览已结束，剩余1页可下载查看

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

【移动应用开发技术】怎么用jQuery的Easyui实现登陆框界面

这篇文章主要讲解了“怎么用jQuery的Easyui实现登陆框界面”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着在下的思路慢慢深入，一起来研究和学习“怎么用jQuery的Easyui实现登陆框界面”吧！效果图CSSa{

text-decoration:none;

}

body{

margin:0px;

}

#header{

width:100%;

height:30px;

background-color:#E0EFFF;

padding-top:

5px;

padding-bottom:

10px;

}

#header

.logo{

margin-left:

50px;

font-size:

24px;

font-family:

微软雅黑;

}

#picture{

width:100%;

height:750px;

}

.panel-title

{

text-align:

center;

font-size:

16px;

}

#bootom{

padding-top:50px;

width:100%;

height:100px;

background:

#eaf2ff;

}

#bootom_content{

margin-left:100px;

width:80%;

text-align:

center;

font-size:0.8em;

}

p{

line-height:20px;

}HTML<!DOCTYPE

html

PUBLIC

"-//W3C//DTD

XHTML

1.0

Transitional//EN"

"/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html

xmlns="/1999/xhtml"

xml:lang="en">

<head>

<meta

http-equiv="Content-Type"

content="text/html;charset=UTF-8">

<!--

引用的css

-->

<link

rel="stylesheet"

type="text/css"

href="themes/default/easyui.css"

rel="external

nofollow"

>

<link

rel="stylesheet"

type="text/css"

href="themes/default/panel.css"

rel="external

nofollow"

>

<link

rel="stylesheet"

type="text/css"

href="themes/icon.css"

rel="external

nofollow"

>

<link

rel="stylesheet"

type="text/css"

href="css/index.css"

rel="external

nofollow"

>

<script

type="text/javascript"

src="js/jquery.min.js"></script>

<script

type="text/javascript"

src="js/jquery.easyui.min.js"></script>

<title>系统首页</title>

</head>

<script

type="text/javascript">

("==================")

$('#p').panel('move',{

left:100,

top:100

});

</script>

<body>

<div

id="header"

>

<div

class="logo"

onclick="window.location.href='index.html'">

<strong信息系统</strong>

</div>

</div>

<div

id="picture"

>

<div

data-options="

region:'east',split:true,style:{position:'absolute',right:50,top:150}"

class="easyui-panel

"

title="用户登录"

>

<div

>

<form

id="ff"

class="easyui-form"

method="post"

data-options="novalidate:true">

<table

cellpadding="5">

<tr>

<td><input

class="easyui-textbox"

data-options="prompt:'账号',validType:'name'"

iconCls="icon-man"

iconAlign=left

/></td>

</tr>

<tr>

<td><input

class="easyui-textbox"

data-options="prompt:'密码',validType:'password'"

iconCls="icon-lock"

iconAlign=left

></input></td>

</tr>

<tr>

<td><input

class="easyui-textbox"

data-options="prompt:'验证码',validType:'validate'"

iconCls="icon-filter"

iconAlign=left

/>    

<img

src=""

alt=""

width="56"

height="32"

align='absMiddle'

/>

</td>

</tr>

</table>

</form>

<div

>

<a

href="#"

rel="external

nofollow"

rel="external

nofollow"

class="easyui-linkbutton"

>登录</a>    

<a

href="#"

rel="external

nofollow"

rel="external

nofollow"

class="easyui-linkbutton"

>注册</a>

</div>

</div>

</div>

</div>

<div

id="bootom">

<div

id="bootom_content">

<p><strong>关于我们   

法律声明

   

服务条款

   

联系我们</strong></p>

<p>

地址：江西省南昌市经济开发区天祥大道

   邮箱：330000

   Copyright

©

2017

-

2018

   hacker_pangdaxing@

版权所有

</p>

<p>

建议使用IE8以上版本浏览器

   E-mail：hacker_pandaxing@

</p>

</div>

</div>

</body>

<script>

function

submitForm(){

$('#ff').form('submit',{

人人文库> 全部分类> 专业文献 > IT计算机

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论