教程集 > jQuery > jquery 教程 > 正文 js特效图片漂浮效果代码

js特效图片漂浮效果代码

发布时间：2023-12-22 编辑：jiaochengji.com

教程集为您提供js特效图片漂浮效果代码等资源，欢迎您收藏本站，我们将为您提供最新的js特效图片漂浮效果代码资源

js特效图片漂浮效果代码

提示：您可以先修改部分代码再运行

<style type=text/css>#divCircle   {  HEIGHT: 50px; POSITION: absolute; TOP: 100px; WIDTH:-50px; Z-INDEX: 1  }  .clButtons {  	FONT-FAMILY: 宋体; FONT-SIZE: 10pt; HEIGHT: 10px; LEFT: 100px; POSITION: absolute; TOP: 20px; VISIBILITY: hidden; WIDTH: 50px; Z-INDEX: 10  }  .clButtons A {  	COLOR: #7B50AC  }  </style>    <script language=JavaScript type=text/javascript>  function lib_bwcheck(){   	this.ver=navigator.appVersion  	this.agent=navigator.userAgent  	this.dom=document.getElementById?1:0  	this.opera5=this.agent.indexOf("Opera 5")>-1  	this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;   	this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;  	this.ie4=(document.all && !this.dom && !this.opera5)?1:0;  	this.ie=this.ie4||this.ie5||this.ie6  	this.mac=this.agent.indexOf("Mac")>-1  	this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;   	this.ns4=(document.layers && !this.dom)?1:0;  	this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)  	return this  }  var bw=new lib_bwcheck()  numItems = 4  circleXstart = 10  circleYstart = -25   circleXoffset = 5  circleYoffset = -3  circlePXspeed = 5  circleTspeed = 10  circleStay = 1   function makeObj(obj,nest,x,y){  	nest = (!nest)?"":'document.' nest '.'		  	this.css = bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest 'document.' obj):0  	this.evnt = bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?this.css:0  	this.showIt = b_showIt  	this.moveIt = b_moveIt  	this.slide = b_slide  	this.slideIt = b_slideIt  	this.obj = obj "Object"  	eval(this.obj "=this")  	return this  }  var px = bw.ns4||window.opera?"":"px";    function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x px; this.css.top=this.y px;}  function b_showIt(){this.css.visibility="visible"}  function b_slideIt(endx,endy,inc,speed,fn,wh) {  	if (!this.slideactive) {  		var distx = endx - this.x  		var disty = endy - this.y  		var num = Math.sqrt(Math.pow(distx,2)   Math.pow(disty,2))/inc  		var dx = distx/num  		var dy = disty/num  		this.slideactive = 1  		this.slide(dx,dy,endx,endy,speed,fn,wh)  	}  }    function b_slide(dx,dy,endx,endy,speed,fn,wh) {  	if (!fn) fn = null  	if (!wh) wh = null  	if (this.slideactive && (Math.floor(Math.abs(dx))<Math.floor(Math.abs(endx-this.x)) || 	Math.floor(Math.abs(dy))<Math.floor(Math.abs(endy-this.y)))) {  		this.moveIt(this.x dx,this.y dy)  		eval(wh)  		slidTim = setTimeout(this.obj ".slide(" dx "," dy "," endx "," endy "," speed ",'" fn "','" wh "')",speed)  	}  	else{  		this.slideactive = 0  		this.moveIt(endx,endy)  		eval(fn)  	}  }  function slideballInit(){  	oBut = new Array()  	for (var i=0; i<=numItems; i  ){  		oBut[i] = new makeObj('divButton' i)  	}  	oCircle = new makeObj('divCircle')  	oBut[0].moveIt(5,100);oBut[1].moveIt(100,100);oBut[2].moveIt(200,100);oBut[3].moveIt(290,100);oBut[4].moveIt(370,100);  	  	  	  	oCircle.moveIt(circleXstart,circleYstart)  	  	for(var i=0; i<=numItems; i  ){  		oBut[i].showIt()  	}  }  var slidTim = 100;  var active = -1  function sbmover(num){  	clearTimeout(slidTim)  	oCircle.slideactive = false  	oCircle.slideIt(oBut[num].x circleXoffset,oBut[num].y circleYoffset,circlePXspeed,circleTspeed)  }  function sbmout(num){  	clearTimeout(slidTim)  	oCircle.slideactive = false  	if (active>-1 && circleStay) oCircle.slideIt(oBut[active].x circleXoffset,oBut[active].y circleYoffset,circlePXspeed,circleTspeed)  	else oCircle.slideIt(circleXstart,circleYstart,circlePXspeed,circleTspeed)  }  function changeListing(num){  	active = num  }  if(bw.bw) onload = slideballInit;  </script>  <div id="divCircle">     <img src="" width="22" height="22" border="0">   </div>  <div id="divButton0" class="clButtons">JavaScript</div>  <div id="divButton1" class="clButtons">VisualBasic</div>  <div id="divButton2" class="clButtons">VisualC   </div>  <div id="divButton3" class="clButtons">Codelphi</div>  <div id="divButton4" class="clButtons">JAVA</div>

提示：您可以先修改部分代码再运行

您可能感兴趣的文章：
js漂浮广告代码示例
 js实现漂浮广告效果的代码
 js全屏漂浮广告代码移入光标停止移动
 漂亮的仿国外网站图片展示效果
 js漂亮特效图片震动效果代码
 Photoshop合成漂浮在树林半空的女孩效果制作教程
 漂浮广告的js代码 js图片漂浮特效
 JS全屏漂浮广告、移入光标停止移动
 js右侧漂浮广告的小例子
 网页右侧漂浮广告窗口的js代码

上一篇：兼容ie6,7,8,forfire图片载入等待效果下一篇：带链接向上滚动字幕代码

[关闭]

最近更新

浏览排行

~ ~