html浮窗
製作方法:
⑵ html中如何做懸浮的窗口
轉出來給高手解答!
微博里高手多的是!
⑶ HTML浮動窗口
<html>
<head>
<script language="javascript">
function hovercell() {
var objDiv = document.getElementById("float-div");
objDiv.style.display = "block";
}
function hiddenDiv() {
var objDiv = document.getElementById("float-div");
objDiv.style.display = "none";
}
</script>
</head>
<body >
<table>
<tr>
<td >
<div onmouseover="hovercell()" >滑鼠放在這里</div>
</td>
</tr>
</table>
<div style='position:absolute;top:40;left:10; display:none;
width:300px;height:180px;border:1px double #AAA' id='float-div' onmouseout="hiddenDiv()" onmouseover="hovercell()">
This is a float div.
</div>
</body>
</html>
⑷ 求HTML網站中的漂浮窗口代碼````
<div id="img" style="position:absolute; left:35px; top:556px; width:120; height:172">
<a href="/"qyml7.htm"> <img border="0" src="/"lo1.gif" width="140" height="120"></a></p>
</div>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var xPos = 20;
var yPos = document.body.clientHeight;
var step = 1;
var delay = 30;
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
img.style.top = yPos;
function changePos() {
width = document.body.clientWidth;
height = document.body.clientHeight;
Hoffset = img.offsetHeight;
Woffset = img.offsetWidth;
img.style.left = xPos + document.body.scrollLeft;
img.style.top = yPos + document.body.scrollTop;
if (yon) {
yPos = yPos + step;
}
else {
yPos = yPos - step;
}
if (yPos < 0) {
yon = 1;
yPos = 0;
}
if (yPos >= (height - Hoffset)) {
yon = 0;
yPos = (height - Hoffset);
}
if (xon) {
xPos = xPos + step;
}
else {
xPos = xPos - step;
}
if (xPos < 0) {
xon = 1;
xPos = 0;
}
if (xPos >= (width - Woffset)) {
xon = 0;
xPos = (width - Woffset);
}
}
function start() {
img.visibility = "visible";
interval = setInterval('changePos()', delay);
}
start();
// End -->
</script>
⑸ html(網頁)浮動窗口,如何製作html(網頁)浮動窗口
浮動窗口可以很簡單的弄個,就是一個div 樣式<div style=" position:fixed; top:50%; left:50%; width:100px; height:50px; margin:-25px 0 0 -50px; ">內容</div>
⑹ 求html浮窗代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>test</title>
</head>
<body onload="init();">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td>test page</td></tr>
</table>
<div id="divContent" style="position: absolute; top: 200px; filter: alpha(opacity=70); background-Color:green;display:none;" ><!-- opacity=70調整透明度,數值自定義 -->
<table width="200" height="100">
<tr>
<td>username</td>
<td><input type="text"></td>
</tr>
<tr>
<td>password</td>
<td><input type="password"></td>
</tr>
<tr>
<td><input type="button" onclick="closeWin();" value="ok"></td>
<td><input type="button" onclick="closeWin();" value="cancle"></td>
</tr>
</table>
</div>
</body>
<script language="javascript">
function init()
{
setTimeout("showWin()", 1000); //1000表示1秒鍾
}
function showWin()
{
var div = document.getElementById("divContent");
div.style.display = "block";
}
function closeWin()
{
var div = document.getElementById("divContent");
div.style.display = "none";
}
</script>
</html>
具體的樣式你自己在<div id="divContent" style="position: absolute; top: 200px; filter: alpha(opacity=70); background-Color:green;display:none;" >里設定
⑺ html怎麼實現這網頁中的懸浮窗
在這里有教程啊,網頁鏈接,你自己看看吧。
⑻ html里怎麼製造浮動窗口
需要浮動的話,只需要在樣式上的position設置fixed即可。
比如:
<div style="position:fixed; z-index:1;">
</div>
這樣寫就浮動了,然後只需要用、bottom、left、right來定位就行了
如果需要飄來飄去的浮動,需要配合js來完成,js可以去牛圖庫上找,裡面有很多插件,改下樣式就可以使用了。
⑼ html中浮動窗口怎麼做啊就是一個小窗口飄在在頁面上那種
浮動窗口可以用js實現。帶關閉窗口的簡單全屏浮動代碼如下:
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
<title>帶關閉按鈕的浮動窗口</title>
</head>
<styletype="text/css">
#fdck{border:1pxsolid#c0c0c0;margin:0auto;padding:5px;background:#f0f0f0}
</style>
<body>
<divid="img"style="position:absolute;left:311;top:815;visibility:hidden;"onmouseover="clearInterval(interval)"onmouseout="interval=setInterval('changePos()',delay)"align="middle">
<spanstyle="CURSOR:hand;color:red;font-weight:bold;font-size:12px"onclick="clearInterval(interval);img.style.visibility='hidden'">關閉</span>
<divid="fdck">
浮動測試TEST
</div>
</div>
<scriptlanguage=javascript>
varxPos=20;
varyPos=document.body.clientHeight;
varstep=1;
vardelay=30;
varheight=0;
varHoffset=0;
varWoffset=0;
varyon=0;
varxon=0;
varpause=true;
varinterval;
img.style.top=yPos;
functionchangePos(){
width=document.body.clientWidth;
height=document.body.clientHeight;
Hoffset=img.offsetHeight;
Woffset=img.offsetWidth;
img.style.left=xPos+document.body.scrollLeft;
img.style.top=yPos+document.body.scrollTop;
if(yon){
yPos=yPos+step;
}
else{
yPos=yPos-step;
}
if(yPos<0){
yon=1;
yPos=0;
}
if(yPos>=(height-Hoffset)){
yon=0;
yPos=(height-Hoffset);
}
if(xon){
xPos=xPos+step;
}
else{
xPos=xPos-step;
}
if(xPos<0){
xon=1;
xPos=0;
}
if(xPos>=(width-Woffset)){
xon=0;
xPos=(width-Woffset);
}
}
functionstart(){
img.style.visibility="visible";
interval=setInterval('changePos()',delay);
}
start();
</script>
</body>
</html>
粘貼到本地一個記事本,保存為HTML格式打開即可看見。
如果只是固定在一個位置不動,可以在div的style設置『position:fixed;』即可。
⑽ 關於HTML做懸浮窗口
<style>
#nav { width:150px; height: 400px; border: 1px solid #D4CD49; position:fixed;left:0;top:30% }
</style>
<div id="nav"></div>
你看這樣行不行