社区
JavaScript
帖子详情
页面上的漂移图标怎么做的?
hyllp
2003-10-21 10:40:25
就是那种在主页上飘来飘去,还做个链接的,怎么现在网站都没这个了。
多谢
...全文
53
2
打赏
收藏
页面上的漂移图标怎么做的?
就是那种在主页上飘来飘去,还做个链接的,怎么现在网站都没这个了。 多谢
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
2 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
利而不害
2003-10-21
打赏
举报
回复
<BODY onLoad="moveIt()">
<a href="http://www.csdn.net"><img id="moveImg" src="http://expert.csdn.net/images/csdn.gif" border="0" style="position:absolute;top:0;left:0"></a>
<SCRIPT LANGUAGE="JavaScript">
var landscape = 5;
var portrait = 3;
var EndTop = parseInt(document.body.offsetHeight) - parseInt(moveImg.height);
var EndLeft = parseInt(document.body.offsetWidth) - parseInt(moveImg.width);
function moveIt() {
var NowTop = parseInt(moveImg.style.top);
var NowLeft = parseInt(moveImg.style.left);
if(NowTop < 0 || NowTop > EndTop) {
portrait = portrait * -1;
}
if(NowLeft < 0 || NowLeft > EndLeft) {
landscape = landscape * -1;
}
moveImg.style.top = NowTop + portrait;
moveImg.style.left = NowLeft + landscape;
setTimeout("moveIt()",50);
}
</SCRIPT>
</BODY>
longshenwang
2003-10-21
打赏
举报
回复
先在title中加入
<script language="JavaScript" src="fly.js"></script>
然后再body中加入
<DIV id=lg style="WIDTH: 189px; POSITION: absolute; HEIGHT: 120px"><A href="转移页.html"><IMG src="pic.jpg" border=0></A></DIV>
<script>
lg();
</script>
最后js文件是:
fly.js
var brOK=false;
var mie=false;
var aver=parseInt(navigator.appVersion.substring(0,1));
var aname=navigator.appName;
function checkbrOK()
{if(aname.indexOf("Internet Explorer")!=-1)
{if(aver>=4) brOK=navigator.javaEnabled();
mie=true;
}
if(aname.indexOf("Netscape")!=-1)
{if(aver>=4) brOK=navigator.javaEnabled();}
}
var vmin=2;
var vmax=5;
var vr=2;
var timer1;
function Chip(chipname,width,height)
{this.named=chipname;
this.vx=vmin+vmax*Math.random();
this.vy=vmin+vmax*Math.random();
this.w=width;
this.h=height;
this.xx=0;
this.yy=0;
this.timer1=null;
}
function movechip(chipname)
{
if(brOK)
{eval("chip="+chipname);
if(!mie)
{pageX=window.pageXOffset;
pageW=window.innerWidth;
pageY=window.pageYOffset;
pageH=window.innerHeight;
}
else
{pageX=window.document.body.scrollLeft;
pageW=window.document.body.offsetWidth-8;
pageY=window.document.body.scrollTop;
pageH=window.document.body.offsetHeight;
}
chip.xx=chip.xx+chip.vx;
chip.yy=chip.yy+chip.vy;
chip.vx+=vr*(Math.random()-0.5);
chip.vy+=vr*(Math.random()-0.5);
if(chip.vx>(vmax+vmin)) chip.vx=(vmax+vmin)*2-chip.vx;
if(chip.vx<(-vmax-vmin)) chip.vx=(-vmax-vmin)*2-chip.vx;
if(chip.vy>(vmax+vmin)) chip.vy=(vmax+vmin)*2-chip.vy;
if(chip.vy<(-vmax-vmin)) chip.vy=(-vmax-vmin)*2-chip.vy;
if(chip.xx<=pageX)
{chip.xx=pageX;
chip.vx=vmin+vmax*Math.random();
}
if(chip.xx>=pageX+pageW-chip.w)
{chip.xx=pageX+pageW-chip.w;
chip.vx=-vmin-vmax*Math.random();
}
if(chip.yy<=pageY)
{chip.yy=pageY;
chip.vy=vmin+vmax*Math.random();
}
if(chip.yy>=pageY+pageH-chip.h)
{chip.yy=pageY+pageH-chip.h;
chip.vy=-vmin-vmax*Math.random();
}
if(!mie)
{eval('document.'+chip.named+'.top ='+chip.yy);
eval('document.'+chip.named+'.left='+chip.xx);
}
else
{eval('document.all.'+chip.named+'.style.pixelLeft='+chip.xx);
eval('document.all.'+chip.named+'.style.pixelTop ='+chip.yy);
}
chip.timer1=setTimeout("movechip('"+chip.named+"')",100);
}
}
function stopme(chipname)
{if(brOK)
{
eval("chip="+chipname);
if(chip.timer1!=null)
{clearTimeout(chip.timer1)}
}
}
var lg;
var chip;
function lg()
{checkbrOK();
lg=new Chip("lg",60,80);
if(brOK)
{ movechip("lg");
}
}
browserName = navigator.appName;
browserVersion = navigator.appVersion.charAt(0);
changeimgok =
(browserName == "Netscape" && browserVersion >= 3) ||
(browserName == "Microsoft Internet Explorer" && browserVersion >= 4)
详细解析:uni-app|vue组件实现漂浮的地标
图标
纯CSS动效
“不务正业”的小凡又来了!(*^▽^*) 今天,我来跟大家分享一个漂浮的地标
图标
动效,
做
出来的效果就像一个????一样,在
页面
中飘飘忽忽的,很显眼的,放到
页面
中大概率能启到吸引人们注意的目的。一起来看一下,它是如何实现的吧!(* ̄︶ ̄)
解决 cesium 地图因为transfrom 导致 地图偏移,点击不准的问题
在我们
做
可视化大屏的时候 我们经常要适应不同的屏幕, 如果拿rem 来
做
的话也是没问题的,但是很多组件就要自己改才行, 地图也是百分比也是大家的方案。 但是仔细观察阿里云的datav 大屏方案,它是由body transfrom scale来解决这个问题,所有dom 元素进行缩放,px一样可以 但是对于很多地图引擎来说就会有很大的问题, 地图因此会导致放大缩小偏移, 点击要素不准,拖动地图
漂移
等等一系列问题 这个时候我们就要看cesium 源码来解决这个问题 我们下载cesium 源码 找到ScreenSp
百度地图绘制实时路线以及最短线路规划
如何使用百度地图绘制实时路线以及最短线路规划最近在
做
百度地图的实时路线绘制,发现一些问题,比如由于定位
漂移
带来的路线绘制偏差,还有由于定位
漂移
,导致人未走动时,也会绘制路线等。百度鹰眼的线路纠偏个人感觉很一般啊。而且有限
漂移
了两百米的点他也没有纠正过来。所以最后还是决定自己写一个纠偏吧。而且百度地图官方的dome和示例代码真的很示例啊。然人摸不着头脑。ok进入正题,思路是这样的,因为实时绘制线路都是
JS制作小车上下左右移动
假设一个在html
页面
元素,你可以通过按键盘上下左右键来控制它的位置并且能改变它的方向,下面我们用’小车’来实现。 方法一 这个方法需要用四张不同的小车图片,当我们按下键盘上下左右键后通过if判断键值来改变小车的移动方向并且更换对应的图片,最终达到小车开动的效果。 图片: 详细代码: <!DOCTYPE html> <html lang="en"> <head...
css web
页面
实现一个弹窗
css web
页面
实现一个弹窗
JavaScript
87,910
社区成员
224,616
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章