function Marquee()
专注于为中小企业提供成都网站设计、网站制作服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业延安免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了1000+企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。
{ if(demo2.offsetWidth-demo.scrollLeft=0)
demo.scrollLeft-=demo1.offsetWidth
else{ demo.scrollLeft++ }
}
上面这段代码控制横向滚动条滚动
var MyMar=setInterval(Marquee,speed)
上面这段代码让浏览器每30毫秒调用一次Marquee函数
也就是让滚动条滚动
demo.onmouseover=function()
{
clearInterval(MyMar)
}
上面这段代码让 当鼠标移动到demo控件上时停止调用Marquee函数
也就是说,鼠标移动到demo控件上,滚动条不再滚动
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
上面这段代码 当鼠标从demo控件上移开始,继续每30毫秒调用一次Marquee函数
也就是让滚动条继续滚动
把下面这段代码加到BODY ........后面
DIV id=ly2
style="HEIGHT: 128px; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 150px"A
href="prodlist.php?departmentid=3" target=_blankIMG
src="images/hadef.gif" border=0/A/DIV
SCRIPT
PI=3.1416;
if (window.screen.width==1024)
{
center_x=400;
center_y=300;
}
if (window.screen.width==800)
{
center_x=300;
center_y=200;
}
function _locate_layer(this_layer,cx,cy,x,y)
{
this_layer.style.top=document.body.scrollTop+cy-y;
this_layer.style.left=document.body.scrollLeft+cx+x;
}
// ly2:move sin-----------------------------------------------------
_move_sin_ly2_run=1;
_move_sin_ly2_i=0;
function _move_sin_ly2(x_step,y_step)
{
x=_move_sin_ly2_i;
y=Math.sin(x/50)*y_step;
_move_sin_ly2_i=_move_sin_ly2_i+x_step;
_locate_layer(ly2,0,center_y,x,y);
if (x(window.screen.width-250)) _move_sin_ly2_i=0;
}
function _move_sin_ly2_pro()
{
_move_sin_ly2(2,75);
if (_move_sin_ly2_run) setTimeout("_move_sin_ly2_pro()",100);
}
function _move_sin_ly2_pro_pause()
{
_move_sin_ly2_run=0;
}
function _move_sin_ly2_pro_play()
{
_move_sin_ly2_run=1;
_move_sin_ly2_pro();
}
// ly2:move sin------------------------------------------------------
_move_sin_ly2_pro();
/SCRIPT
楼主咋能这样说捏…………这是个很简答的东西…………
自己看最后一个javascript函数的注释,页面上的展示是一个DNA式的展示,其实就是两个楼主要求的东西向不同方向开始震动…………
很郁闷,20分钟完成功能,花了一个小时来优化了下代码…………
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
html
head
title旗帜飘扬.html/title
meta http-equiv="keywords" content="keyword1,keyword2,keyword3"
meta http-equiv="description" content="this is my page"
meta http-equiv="content-type" content="text/html; charset=UTF-8"
!--link rel="stylesheet" type="text/css" href="./styles.css"--
style type="text/css"
.flaggingStyle {
color: #0066ff;
font-family: 隶书;
font-size: 24pt;
font-weight: normal;
}
/style
script type="text/javascript"
function flaggingMove(strTargetName, flaggingPosNo, flaggingVolatility, messageLength) {
for (var i = messageLength - 1; i = 1; i--) {
document.getElementById("Flag_" + strTargetName + i).style.top = document.getElementById("Flag_" + strTargetName + (i - 1)).offsetTop;
}
var target = document.getElementById(strTargetName);
var nowPos = parseInt(target.getAttribute("flaggingPosition"));
var nowDir = parseInt(target.getAttribute("flaggingDrection"));
if (nowPos == flaggingPosNo || nowPos == flaggingPosNo * -1) {
nowDir = nowDir * -1;
target.setAttribute("flaggingDrection", nowDir);
}
nowPos = nowPos + nowDir;
target.setAttribute("flaggingPosition", nowPos);
document.getElementById("Flag_" + strTargetName + "0").style.top = target.offsetTop + flaggingVolatility * Math.sin(Math.PI * nowPos / 2 / flaggingPosNo);
}
function flaggingReColor(strTargetName, messageLength) {
for (var i = messageLength - 1; i = 1; i--) {
document.getElementById("Flag_" + strTargetName + i).style.color = document.getElementById("Flag_" + strTargetName + (i - 1)).style.color;
}
document.getElementById("Flag_" + strTargetName + "0").style.color = Math.random() * 255 * 255 * 255 + Math.random() * 255 * 255 + Math.random() * 255;
}
function startFlagging(strCtrlName, flaggingPosNo, flaggingVolatility, messageLength, flaggingTerm, reColorTerm){
window.setInterval("flaggingMove('" + strCtrlName + "', " + flaggingPosNo + ", " + flaggingVolatility + ", " + messageLength + ");", flaggingTerm);
window.setInterval("flaggingReColor('" + strCtrlName + "', " + messageLength + ");", reColorTerm);
}
/**
* strFlaggingMessage 字符串,信息内容
* textwidth 数字,信息字符的宽度
* flaggingPosNo 数字,半周期变化位置的次数
* startPos 数字,小于等于flaggingPosNo,开始位置
* startDir 数字,1或-1,开始时字符移动的方向(向上或向下)
* flaggingVolatility 数字,字符每次移动的距离,flaggingVolatility*flaggingPosNo*2=字符震动的幅度
* flaggingTerm 数字,字符每隔多少毫秒移动一次,flaggingTerm*flaggingPosNo*4=字符震动的周期
* reColorTerm 数字,字符颜色每隔多少毫秒变化一次
* flaggingClass 字符串,定义字符的css的classname
*/
function flaggingCtrl(strFlaggingMessage, textwidth, flaggingPosNo, startPos, startDir, flaggingVolatility, flaggingTerm, reColorTerm, flaggingClass) {
var strCtrlName = "FlaggingMessageCtl";
if(document.getElementById(strCtrlName)){
var i = 0;
while(document.getElementById(strCtrlName + "_" + i)){
i = i + 1;
}
strCtrlName = strCtrlName + "_" + i;
}
document.write("span id=\"" + strCtrlName + "\"/span");
var target = document.getElementById(strCtrlName);
var x = target.offsetLeft;
var y = target.offsetTop;
target.style.position = "absolute";
target.setAttribute("flaggingPosition", startPos);
target.setAttribute("flaggingDrection", startDir);
var messageArr = strFlaggingMessage.split("");
for (i = 0; i = messageArr.length - 1; i++) {
var newSpan = document.createElement("span");
newSpan.innerText = messageArr[i];
newSpan.setAttribute("id", "Flag_" + strCtrlName + i);
newSpan.className = flaggingClass;
newSpan.style.position = "absolute";
newSpan.style.top = y;
newSpan.style.left = x + i * textwidth;
document.body.appendChild(newSpan);
}
startFlagging(strCtrlName, flaggingPosNo, flaggingVolatility, messageArr.length, flaggingTerm, reColorTerm);
}
/script
/head
body
br /
br /
br /
br /
br /
br /
br /
br /
br /
script type="text/javascript"
flaggingCtrl("准备要像旗帜飘扬般晃动的信息1………………", 35, 4, 0, -1, 50, 35, 300, "flaggingStyle");
/script
script type="text/javascript"
flaggingCtrl("准备要像旗帜飘扬般晃动的信息2………………", 35, 4, 0, 1, 50, 35, 300, "flaggingStyle");
/script
/body
/html
DIV id=img style="position:absolute;z-index=99;" A href="#" target=_blankIMG height=80 width=80 alt="dfs" src="#" border=0 /A/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 把代码复制到你的网页中
应该是Flash,但是做的东西是Microangelo,Microangelo是一款小而强大的图标制做器,安装完成后才5MB哦!!!中文版的简单极了!!!
悬浮窗或者浮动窗。
浮动窗有两种方式,一种是浮动的层在网页上面任意飘动,一种是浮动的层跟随滚动条来回移动。这两种效果一般都可以利用javascript制作出来的。
网页上飘动的动态网页指网页是根据用户请求,由服务器上程序动态的生成的浮动窗。