html弹出悬浮窗口代码,怎么实现啊 ???

html-css013

html弹出悬浮窗口代码,怎么实现啊 ???,第1张

做到比较简单

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

#apDiv1 {

position:absolute

width:200px

height:115px

z-index:1

background-color:#CCC

left: 165px

top: 211px

display:none

}

</style>

<script type="text/javascript">

function a(){

var a=document.getElementById("a").value

if(a=="tijiao"){

document.getElementById("apDiv1").style.display="block"

}

}

</script>

</head>

<body>

<input type="button" value="tijiao" id="a" onclick="a()" />

<div id="apDiv1">hello</div>

</body>

</html>

首先根据需求我们需要一个按钮,一个弹出窗口层;\x0d\x0aOK,废话不多说;\x0d\x0a按钮就用一个基本的:\x0d\x0aClick me\x0d\x0a我是浮动的窗口\x0d\x0a\x0d\x0a我们要给浮动层设置一下样式\x0d\x0a.dialog{width:200pxheight:200pxborder:solid 1px #000position:absoluteright:10pxtop:100pxline-height:200pxtext-align:centerdisplay:none}\x0d\x0a\x0d\x0aOK ,下面就是JS部分:\x0d\x0a首先需要引入一个JS库,版本自己定义:\x0d\x0a然后给按钮添加相应的点击事件,让点击button的时候,显示出浮动层\x0d\x0a$(".btn").click(function(){\x0d\x0a$(".dialog").show(100)\x0d\x0a}) 回答于 2022-11-16