JavaScript实现弹出窗口实质上就是在浏览器上画了一个方形区域,并在开始时将其隐藏,只是到某个JavaScript事件时才通过修改css的属性值来将其显示出来。
其大致步骤为:
"codetitle">复制代码 代码如下:
<html>
<head>
<title>jQuery实例1:浮动窗口</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<mce:script type="text/javascript" src="/UploadFiles/2021-04-02/jquery.js"> <mce:script type="text/javascript" src="/UploadFiles/2021-04-02/jquerywin.js"> <link type="text/css" rel="stylesheet" href="css/win.css" mce_href="css/win.css">
</head>
<body>
</body>
<a onclick="showWin()" href="#" mce_href="#">弹出窗口</a>
<div id="win">
<div id="title">我是标题栏!<span id="close" onclick="hide()">X</span></div>
<div id="content">我是一个窗口!</div>
</div>
</html>
"codetitle">复制代码 代码如下:
#win{
/*边框*/
border:1px red solid;
/*窗口的高度和宽度*/
width : 300px;
height: 200px;
/*窗口的位置*/
position : absolute;
top : 100px;
left: 350px;
/*开始时窗口不可见*/
display : none;
}
/*控制背景色的样式*/
#title{
background-color : blue;
color : red;
/*控制标题栏的左内边距*/
padding-left: 3px;
}
#cotent{
padding-left : 3px;
padding-top : 5px;
}
/*控制关闭按钮的位置*/
#close{
margin-left: 188px;
/*当鼠标移动到X上时,出现小手的效果*/
cursor: pointer;
}
"codetitle">复制代码 代码如下:
function showWin(){
/*找到div节点并返回*/
var winNode = $("#win");
//方法一:利用js修改css的值,实现显示效果
// winNode.css("display", "block");
//方法二:利用jquery的show方法,实现显示效果
// winNode.show("slow");
//方法三:利用jquery的fadeIn方法实现淡入
winNode.fadeIn("slow");
}
function hide(){
var winNode = $("#win");
//方法一:修改css的值
//winNode.css("display", "none");
//方法二:jquery的fadeOut方式
winNode.fadeOut("slow");
//方法三:jquery的hide方法
winNode.hide("slow");
}
jquery,弹出窗口
RTX 5090要首发 性能要翻倍!三星展示GDDR7显存
三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。
首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。
据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。