为网站添加图片漂浮公告

 时间:2026-02-14 08:08:00

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/html; charset=utf-8" />

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

</head>

<div style="Z-INDEX: 99; POSITION: absolute" id=img><A href=""><IMG border=0 alt=img src="announcement02.jpg

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

var xPos = document.documentElement.clientWidth-20;

var yPos = document.documentElement.clientHeight/2;

var step = 0.5;

var delay = 5;

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.documentElement.clientWidth;

height = document.documentElement.clientHeight;

Hoffset = img.offsetHeight;

Woffset = img.offsetWidth;

img.style.left = xPos + document.documentElement.scrollLeft + "px";

img.style.top = yPos + document.documentElement.scrollTop + "px";

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();

img.onmouseover = function() {

clearInterval(interval);

interval = null;

}

img.onmouseout = function() {

interval = setInterval('changePos()', delay);

}

//  End -->

</script>

</body>

</html>

该源代码可直接复制到在HTML文件上运行。运行效果图如下:

为网站添加图片漂浮公告

2、图片资源,右键另存为下载

为网站添加图片漂浮公告

为网站添加图片漂浮公告

1、鼠标停留在飘动公告上,公告停止飘动

为网站添加图片漂浮公告

2、运用Dreamweaver热点工具,为公告添加多个链接,分别链接至百度和hao123。

为网站添加图片漂浮公告

3、如果是单链接,<div>标签中的代码可改为:

为网站添加图片漂浮公告

  • 怎么用CorelDRAW制做中国人寿图标
  • 如何用镝数图表制作极坐标气泡图?
  • CorelDRAW怎样给文字描边
  • CorelDraw11技巧之如何排书
  • CDR教程:怎么修改调整填充表格的纯色底色?
  • 热门搜索
    云南旅游服务网 丰宁坝上草原旅游 旅游卫视大驾光临 台湾旅游攻略购物 51旅游好去处 南山牧场旅游攻略 马鞍山旅游汽车站 厦门武夷山旅游攻略 东莞旅游景点排行 去俄罗斯旅游多少钱