div浮动在div顶部 下拉网页浮在顶部 怎么设置

JavaScript014

div浮动在div顶部 下拉网页浮在顶部 怎么设置,第1张

下载jquery.pin,然后解压后在该文件夹目录下新建一个html文件。

编辑这个网页,在里面引入jquery.pin。

具体代码如下:<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="jquery.pin.js"></script>

让图像div碰到屏幕顶后自动随着滚动而悬浮在顶部。

做好后随着滚动而滚动了。

引入了文件后。

<script>

$(".pinned").pin({containerSelector: ".b", minWidth: 940}) </script>

(这段代码里面的.pinned是要悬浮的div,b是这个悬浮div悬浮的范围。)

复制代码

代码如下:

<html>

<head>

<title>javascript实现div浮动在网页最顶上并带关闭按钮效果实例</title>

<style

type="text/css">

<!--

body

{

margin:

0pxpadding:

0pxtext-align:

center}

TD

{FONT-SIZE:

12px

COLOR:

#333}

#toubiao

{BORDER-BOTTOM:

#e2e2e2

1px

solid}

-->

</style>

</head>

<body>

<SCRIPT>

function

toueme(){

document.getElementById("toubiao").style.display="none"

}

</SCRIPT>

<DIV

id=toubiao>

<table

width="100%"

border="0"

cellspacing="0"

cellpadding="5">

<tr>

<td

width="82%"><a

target="_blank"

href="/">

<span

style="text-decoration:

none"><font

color="#808080">悬浮在网页顶部可关闭的工具条(浮动层),点击可以关闭哦</font></span></a></td>

<td

width="14%"

align="right"><a

style="CURSOR:

hand"

onClick=toueme()>

<img

src="../img/close3.gif"

hspace="6"

border=0></a></td>

</tr>

</table>

</DIV>

</body>

</html>

</td>

</tr>

</table>