可关闭的浮动div示例
生活随笔
收集整理的這篇文章主要介紹了
可关闭的浮动div示例
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
頁面效果
示例（黃色框）為可以關閉的浮動div
可以在里面添加<span>, <button>等，靈活實現想要的效果
源碼
<html><head><title>可移動、可關閉的div浮動層</title><meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head><body><style>#postit {position: absolute;width: 250;padding: 5px;background-color:rgba(210,200,0,0.2); /*透明度*/border: 1px solid black;visibility: hidden;z-index: 100;cursor: hand;}</style><div id="postit" style="left:150px;top:150px;"><div align="right"><b><a href="javascript:closeit()">[關閉]</a></b></div><b>CsrCode.Cn：</b></div><script>//Post-it only once per browser session? (0=no, 1=yes)//Specifying 0 will cause postit to display every time page is loadedvar once_per_browser = 0///No need to edit beyond here///var ns4 = document.layersvar ie4 = document.allvar ns6 = document.getElementById && !document.allif (ns4)crossobj = document.layers.postitelse if (ie4 || ns6)crossobj = ns6 ? document.getElementById("postit") : document.all.postitfunction closeit() {if (ie4 || ns6)crossobj.style.visibility = "hidden"else if (ns4)crossobj.visibility = "hide"}function showornot() {if (get_cookie4('postdisplay') == '') {showit()document.cookie4 = "postdisplay=yes"}}function showit() {if (ie4 || ns6)crossobj.style.visibility = "visible"else if (ns4)crossobj.visibility = "show"}if (once_per_browser)showornot()elseshowit()</script></body> </html>總結
以上是生活随笔為你收集整理的可关闭的浮动div示例的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 【Fabric】Python自动化部署工
- 下一篇： 【Flask】jinja2根据url中的