首页 > 代码库 > 基于jQuery实现苹果Dock样式的菜单
基于jQuery实现苹果Dock样式的菜单
爱编程小编之前我们分享过相当数量的jQuery菜单了,今天要给大家带来一款Dock样式的jQuery菜单,用过苹果的朋友都知道,它的Dock菜单非常酷,配合漂亮的图标就更加绚丽了。效果图如下:
在线预览 源码下载
实现的代码。
html代码:
<div id="wrapper"> <img src="images/1.png" width="64"> <img src="images/2.png" width="64"> <img src="images/3.png" width="64"> <img src="images/4.png" width="64"> <img src="images/5.png" width="64"></div>
js代码:
window.onload=function(){ document.onmousemove=function(ev){ var oevent=ev||event; var aimg=document.getElementsByTagName(‘img‘); var odiv=document.getElementById(‘wrapper‘); for(var i=0;i<aimg.length;i++){ var x=aimg[i].offsetLeft+aimg[i].offsetWidth/2; var y=aimg[i].offsetTop+odiv.offsetTop+aimg[i].offsetHeight/2; var a=x-oevent.clientX; var b=y-oevent.clientY; var dis=parseInt(Math.sqrt(a*a+b*b)); var scale=1-dis/200; if(scale<0.5){ scale=0.5; } aimg[i].width=scale*128; } } }
via:http://www.w2bc.com/Article/19605
基于jQuery实现苹果Dock样式的菜单
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。