html模仿苹果电脑任务栏菜单

<script type="text/javascript">

19 window.onload = function ()

20 {

21     var oMenu = document.getElementById("menu");

22     var aImg = oMenu.getElementsByTagName("img");

23     var aWidth = [];

24     var i = 0;

25     //保存原宽度, 并设置当前宽度

26     for (i = 0; i < aImg.length; i++)

27     {

28         aWidth.push(aImg[i].offsetWidth);

29         aImg[i].width = parseInt(aImg[i].offsetWidth / 2);

30     }

31     //鼠标移动事件

32     document.onmousemove = function (event)

33     {

34         var event = event || window.event;

35         for (i = 0; i < aImg.length; i++)

36         {

37             var a = event.clientX - aImg[i].offsetLeft - aImg[i].offsetWidth / 2;

38             var b = event.clientY - aImg[i].offsetTop - oMenu.offsetTop - aImg[i].offsetHeight / 2;

39             var iScale = 1 - Math.sqrt(a * a + b * b) / 300;

40             if (iScale < 0.5) iScale = 0.5;

41             aImg[i].width = aWidth[i] * iScale

42         }

43     };

44 };

45 </script>