<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
/*
常见的UI事件
load
resize
scroll
select 选中
focus 获取焦点
blur 失去焦点事件
*/
</script>
<img src="images/1.jpg" alt="" id="pic">
<input type="text" id="txt">
<script type="text/javascript">
/*
1.当窗口尺寸1200以上，图片显示为充满页面
2.无论何时打开窗口时，图片填充满屏幕
3.当窗口尺寸发生改变时，图片依然填充满屏幕
*/
// var oImg;
// window.onload=function () {
// oImg=document.getElementById('pic');
// // setImg();
// };
// //窗口尺寸发生改变
// window.onresize=function(){
// setImg();
// };
// function setImg(){
// var w=document.documentElement.offsetWidth;//获取窗口尺寸
// // if(w>1200){
// // oImg.style.width=w+'px';
// // }
// oImg.style.width=w+'px';//设置图片大小和窗口尺寸保持一致
// }
var t=document.getElementById('txt');
//获取焦点事件
t.onfocus=function(){
console.log('有焦点');
};
//失去焦点事件
t.onblur=function(){
console.log('失焦');
};
</script>
</body>
</html>常见的UI事件
猜你喜欢
转载自blog.csdn.net/weixin_44606660/article/details/87620885
今日推荐
周排行