Js网站开发学习第一天
1、登录时,记住密码单选框,鼠标移上去显示div里的内容,移开则消失;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type="text/css">
#div1 {
width:100px;
height:50px;
padding:;
margin:;
background-color:white;
border:1px solid;
display:none;
}
</style>
</head>
<body>
<label><input type="checkbox" onmouseover="document.getElementById('div1').style.display='block'" onmouseout="document.getElementById('div1').style.display='none'" />自动登录</label>
<div id="div1">
将会为您提供新的服务
</div>
</body>
2、div鼠标移上去自动变颜色,移开后变为原色
(1)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type="text/css">
div{
width:100px;
height:100px;
background-color:blue;
}
.box {
width:200px;
height:200px;
background-color :green;
}
</style>
</head>
<body>
<div id="div1" onmouseover="document.getElementById('div1').className='box';" onmouseout="document.getElementById('div1').className='';">
</div>
</body>
(2)用Js函数
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type="text/css">
#div1{
width:100px;
height:100px;
background-color:blue;
}
.box {
width:200px;
height:200px;
background-color :green;
}
</style>
<script type="text/javascript">
function toGreen() {
document.getElementById('div1').style.width = '200px';
document.getElementById('div1').style.height = '200px';
document.getElementById('div1').style.backgroundColor = 'green';
}
function tored() {
document.getElementById('div1').style.width = '100px';
document.getElementById('div1').style.height = '100px';
document.getElementById('div1').style.backgroundColor = 'red';
}
</script>
</head>
<body>
<div id="div1" onmouseover="toGreen()" onmouseout="tored()">
</div>
</body>
(3)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type="text/css">
#div1{
width:100px;
height:100px;
background-color:blue;
}
.box {
width:200px;
height:200px;
background-color :green;
}
</style>
<script type="text/javascript">
function toGreen() {
var oDiv1 = document.getElementById('div1');
oDiv1.style.width = '200px';
oDiv1.style.height = '200px';
oDiv1.style.backgroundColor = 'green';
}
function tored() {
var oDiv1 = document.getElementById('div1');
oDiv1.style.width = '100px';
oDiv1.style.height = '100px';
oDiv1.style.backgroundColor = 'red';
}
</script>
</head>
<body>
<div id="div1" onmouseover="toGreen()" onmouseout="tored()">
</div>
</body>
Js网站开发学习第一天的更多相关文章
- .net 网站开发学习资源
慕课网 前端基础学习 http://www.imooc.com/course/list?c=fe 了解需求 例子之一 http://wenku.it168.com/d_000517899.shtml ...
- 使用Google App Engine开始新的网站开发学习
继长时间的迷茫后,我发现还是回归php网站开发更适合我,或者没有那么深刻,但至少要做点事情.不知道以后将从事什么样的工作,但现在找点事情做还是很好的.所以,为了激发我学习的热情,我在网上搜了一下免费云 ...
- 网站开发学习Python实现-Django项目部署-介绍(6.2.1)
@ 目录 1.第一步:找源码 2.第二步:在windows中更改代码 2.第三步:同步到linux中 3.第三步:部署 4.第四步:运行 关于作者 1.第一步:找源码 从github上找一个djang ...
- 网站开发学习Python实现-Django学习-自学注意(6.1.3)
@ 目录 1.配置文件相关 2.应用创建相关 3.项目相关 4.模板相关 5.其他 关于作者 1.配置文件相关 1.可以更改时间,地区相关(国际化) 2.BASE_DIR很重要,一个工程要有很好的移植 ...
- 网站开发学习Python实现-Django学习-介绍(6.1.1)
@ 目录 1.MVT 2.ORM 关于作者 1.MVT 主要的目的是为了快速,简便的开发数据库驱动的网站,强调代码的复用,多个组件可以很方便以插件的方式服务于整个框架,采用的是MVT设计模式(差不多的 ...
- .NET CAD二次开发学习第一天
基于浩辰CAD2019 需求: 开发线转圆简单命令.命令过程:1) 请选择图中直线(要求支持一次选多个):2) 弹出对话框,输入圆的图层名和半径3) 点对话框中确定按钮,结束命令.命令执行效果:所选每 ...
- Vue.js 项目开发学习路线图
1. 思维导图 源文件:Vue路线图.xmind 参考文献 [1]. VueJs2.0建议学习路线 - lavyun - 博客园 [2]. Vue学习路线图 - 个人文章 - SegmentFault ...
- android unity3d开发学习第一步
1:下载unitysetup 开发环境 http://unity3d.com/unity/download/download-windows 2:下载三维制作软件 制作我们需要的场景 http://u ...
- 网站开发学习Python实现-Django的models学习-生鲜项目(6.3.2)
@ 目录 1.说明 2.模型类的设计 3.代码的具体实现 4.详情地址 关于作者 1.说明 models是django的很重要的部分,所以深入研究. 本文章的所研究项目为黑马教育python课程中的项 ...
随机推荐
- MXNet 定义新激活函数(Custom new activation function)
https://blog.csdn.net/weixin_34260991/article/details/87106463 这里使用比较简单的定义方式,只是在原有的激活函数调用中加入. 准备工作下载 ...
- docker本地化异常:/bin/sh: warning: setlocale: LC_ALL: cannot change locale (en_US.UTF-8)
docker中经常设置不了 环境变量$LC_ALL, 导致报很多奇怪的编码错误: /bin/sh: warning: setlocale: LC_ALL: cannot change locale ...
- SpringBoot MAVEN编译报错Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.8.0:
参考了好几篇文章没搞定,直到查询错误关键字 An unknown compilation problem occurred 分别参考了以下博客: https://blog.csdn.net/fanre ...
- Python3基础 list(dict) 使用 * 扩充时,出现字典元素重复问题
Python : 3.7.3 OS : Ubuntu 18.04.2 LTS IDE : pycharm-community-2019.1.3 ...
- asp.net core mvc 读取配置文件appsettings.json
上一篇我们将了读取自定义配置文件.这篇我们讲一下asp.net core mvc里读取自带的配置文件 appsettings.json 首先创建个asp.net core mvc项目,项目里有Prog ...
- springboot 整合OSS
OSS 阿里云对象存储服务(Object Storage Service,简称 OSS),是阿里云提供的海量.安全.低成本.高可靠的云存储服务.OSS可用于图片.音视频.日志等海量文件的存储.各种终端 ...
- java常用JVM参数介绍
采集服务JVM参数说明 -Xmx4g -Xms4g -Xmn512m -XX:MetaspaceSize=256m -XX:MaxMetaspaceSize=4g -Xss256k Xms 是指设定程 ...
- k8s Pod 扩容和缩容
在生产环境下,在面临服务需要扩容的场景时,可以使用Deployment/RC的Scale机制来实现.Kubernetes支持对Pod的手动扩容和自动扩容. 手动扩容缩容 通过执行扩容命令,对某个dep ...
- 常用gem
rails_db better_errors awesome_print web-console irbtools binding_of_caller awesome_rails_console
- 悬架的灵魂——K&C特性
静止便是死亡,只有运动才能敲开永生的大门 — 泰戈尔 KC特性是车辆操控稳定性的直接影响者!可以分为 K ( Kinematic) 特性和 C( Compliance) 特性: K 特性即悬 ...