所需源文件--见下方文件附件
在HTML中的<head>标签中插入如下代码：
<
script
type
="text/javascript"
src
="js/jquery.js"
>
</script>
< script type ="text/javascript" src ="js/interface.js" > </script>
< script type ="text/javascript" src ="js/interface.js" > </script>
<
link
href
="style.css"
rel
="stylesheet"
type
="text/css"
/>
<
!--[if lt IE 7]
>
< style type ="text/css" >
.dock img { behavior: url(iepngfix.htc) }
</style>
< ![endif]– >
< style type ="text/css" >
.dock img { behavior: url(iepngfix.htc) }
</style>
< ![endif]– >
第一部分是需要用到的Javascript代码，第二部分是用到的CSS样式表，最后一个是用于
Internet Explorer 6中PNG图片的Hack处理。
且记要把下面的代码放到HTML中的<body>标签内
<
script
type
="text/javascript"
>
$(document).ready(
function()
{
$(’#dock2′).Fisheye(
{
maxWidth: 60,
items: ‘a’,
itemsText: ’span’,
container: ‘.dock-container2′,
itemWidth: 40,
proximity: 80,
alignment : ‘left’,
valign: ‘bottom’,
halign : ‘center’
}
)
}
);
</script>
$(document).ready(
function()
{
$(’#dock2′).Fisheye(
{
maxWidth: 60,
items: ‘a’,
itemsText: ’span’,
container: ‘.dock-container2′,
itemWidth: 40,
proximity: 80,
alignment : ‘left’,
valign: ‘bottom’,
halign : ‘center’
}
)
}
);
</script>
向顶部菜单中增加新的项目（注：<span>标签位于<img>之后）：
<
a
class
="dock-item"
href
="#"
>
<
img
src
="images/home.png"
alt
="home"
/>
<
span
>Home
</span>
</a>
< a class ="dock-item2" href ="#" > < span >Home </span> < img src ="images/home.png" alt ="home" /> </a>
< a class ="dock-item2" href ="#" > < span >Home </span> < img src ="images/home.png" alt ="home" /> </a>
本文转自chainli 51CTO博客，原文链接：http://blog.51cto.com/lichen/164286，如需转载请自行联系原作者
