我们都喜欢MAC,喜欢FishEye菜单。
实际上整合fisheye到你的项目中非常简单。
你所需要的是javascript,CSS和你的所用到的图片。你可以去下载FisheyeMenu.
URL:http://simply-basic.com/wp-content/uploads/image/fisheyemenu/fisheyemenu.zip
下面就说说怎么安装吧:
1.将解压的ZIP包中的所有文件(注:images目录下的图片可以行更换)上传到你的网站。
2.添加下面的代码到<head></head>之间
<link rel="stylesheet" type="text/css" xhref="http://YourDomainHere/fisheye-menu.css" />
<script xsrc="http://YourDomainHere/fisheye.js" type='text/javascript'></script>
当然你还需要将"http://YourDomainHere/..."换成你自己的网站下相应路径。
3.将下面的代码加到你的页面中你就可以看到fisheye menu的效果了。
<div><ul id="fisheye_menu">
<li><a xhref="http://www.mokha.cn/admin.php#1"><img
xsrc="http://YourWebsite/icon.gif" alt="image description"
/><span>Icon 1</span></a></li>
<li><a xhref="http://www.mokha.cn/admin.php#2"><img
xsrc="http://YourWebsite/icon2.gif" alt="image description"
/><span>Icon 2</span></a></li>
<li><a xhref="http://www.mokha.cn/admin.php#3"><img
xsrc="http://YourWebsite/icon.gif" alt="image description"
/><span>Icon 3</span></a></li>
<li><a xhref="http://www.mokha.cn/admin.php#4"><img
xsrc="http://YourWebsite/icon2.gif" alt="image description"
/><span>Icon 4</span></a></li>
<li><a xhref="http://www.mokha.cn/admin.php#5"><img
xsrc="http://YourWebsite/icon.gif" alt="image description"
/><span>Icon 5</span></a></li>
<li><a xhref="http://www.mokha.cn/admin.php#6"><img
xsrc="http://YourWebsite/icon2.gif" alt="image description"
/><span>Icon 6</span></a></li>
</ul></div>
4.如果你想改变图片大小或图片的扩展名,你可编辑fisheye.js,在前面几行可以看到如下代码:
var fisheyemenu = {
startSize : 55,
endSize : 88,
imgType : ".gif",
将其中的参数改成你想要的就可以了。
更多信息你参看:http://simply-basic.com/posts/19419
分享到:
相关推荐
本篇将详细介绍如何在WinForms中创建一个“非常漂亮”的菜单,并提供相关资源。 标题中的“winfrom非常漂亮的菜单”指的是在Windows Forms应用中设计出吸引眼球且功能完善的菜单系统。在WinForms中,我们通常使用...
【C# Winform漂亮菜单】是针对Windows桌面应用程序开发者,特别是使用C#语言进行Winform界面设计的程序员的一个宝贵资源。这个主题主要关注如何在Windows窗体应用中创建美观、吸引人的用户界面,尤其是菜单部分。...
在C#编程环境中,开发一款类似Windows开始菜单的漂亮菜单是一项常见的需求,尤其对于桌面应用开发者来说。C# 2005版本提供了丰富的UI设计工具和类库,使得实现这样的功能变得相对容易,对比VC++(Visual C++),其...
【fisheye-menu Jquery实现的导航菜单】是一种创新的网页交互设计,它利用了Jquery库的强大功能,为用户提供了独特的视觉体验。在网页设计中,导航菜单是至关重要的组成部分,它帮助用户轻松地浏览网站内容。Fisheye...
"漂亮三级菜单 导航菜单 菜单"这个标题暗示我们关注的是一个多级菜单系统,它可能具有良好的视觉吸引力和易用性,适用于组织复杂的网站结构。这种菜单通常包括主菜单、次级菜单以及更深层次的子菜单,帮助用户方便地...
"vc++一个非常好的漂亮菜单"这个资源提供了一种方法,通过TBCMenu库来为你的应用程序增添专业的菜单设计。TBCMenu是一款针对Visual C++的第三方库,它允许开发者创建具有自定义样式和特效的菜单,使得应用程序的界面...
"仿win7web菜单导航条菜单下拉菜单漂亮的菜单经典的菜单"这一主题着重于模仿Windows 7操作系统中的菜单样式,将这种熟悉且直观的用户体验应用到网页中,提升用户的交互体验。 首先,"win7 导航条"指的是借鉴了...
本文将详细介绍“多个简单漂亮的树型菜单JS代码”这一主题,以及如何利用提供的资源进行应用。 首先,标题中的“多个简单漂亮的树型菜单JS代码”意味着我们拥有若干个不同设计风格且易于实现的JavaScript树形菜单...
标题"漂亮的菜单样式"表明我们关注的焦点在于设计出既吸引眼球又实用的菜单效果。描述中提到的“当鼠标放上去是出来,鼠标移走回收回去”,这通常指的是悬停效果,即鼠标指针悬浮在菜单项上时显示详细内容或子菜单,...
以下是对"wpf自定义漂亮的二级菜单"这一主题的详细解释。 首先,我们来理解WPF中的菜单系统。在WPF中,`Menu`控件用于展示层级结构的选项,通常用于应用程序的顶部或侧边栏。`MenuItem`是`Menu`的基本元素,可以...
**WPF漂亮的导航菜单** 在Windows Presentation Foundation(WPF)框架中,创建美观且功能丰富的用户界面是一项重要的任务。WPF提供了丰富的控件和样式机制,使得开发者能够设计出具有吸引力的导航菜单,以增强用户...
本资源包含一组“超实用漂亮精美html菜单源码”,适用于希望提升网页交互体验的开发者。这些源码集美观与实用性于一体,能帮助你快速构建出吸引用户的网页菜单。 HTML(HyperText Markup Language)是网页开发的...
标题“非常漂亮的导航菜单”暗示我们将探讨的是在设计中注重美学与实用性的菜单实例。 在描述中提到,“我项目应用中几个常用的菜单,超漂亮的,希望能帮助到你”,这可能意味着这些菜单模板或示例是经过实际项目...
本文将详细探讨“漂亮的下拉菜单导航”的实现及其相关知识点。 首先,我们要明白下拉菜单的基本原理。它通常是通过JavaScript、jQuery或者CSS来实现的,当用户悬停在主菜单项上时,与其关联的子菜单会滑动出现。...
"js漂亮的菜单栏"着重关注使用JavaScript实现的动态、交互式的菜单栏。JavaScript是一种广泛应用于网页开发的客户端脚本语言,它能够为静态HTML页面注入活力,提供丰富的用户交互功能。 在创建“js漂亮的菜单栏”时...
"经典完美漂亮菜单集锦"这个资源显然提供了一系列精心设计且功能完善的菜单代码示例,适用于那些希望提升其应用或网站用户体验的开发者。这些菜单代码不仅注重美学,也强调实用性,以C语言为基础,为程序员提供了...
"超漂亮的导航菜单"这个主题,显然聚焦于美观且用户友好的导航设计。这样的菜单不仅可以提升用户体验,还能增强品牌形象,使网站或应用更具吸引力。 1. **导航菜单设计原则**:一个优秀的导航菜单应该简洁明了,...
VueCircleMenu是一个基于Vue.js框架开发的精美圆形菜单组件,专为前端开发者设计,用于创建具有吸引力和用户体验友好的交互式界面。Vue.js是目前非常流行的一个轻量级、高性能的JavaScript框架,它以组件化开发为...
"android超漂亮菜单" 提供了一种实现方法,它以丝般顺滑的操作感和独特的视觉效果吸引用户。下面我们将深入探讨如何在Android中创建这样的菜单,以及与之相关的技术点。 首先,`AndroidManifest.xml`是每个Android...
这种菜单布局使得网站导航更为直观,尤其适用于移动设备或空间有限的界面。本文将深入探讨如何使用HTML和CSS来创建美观的竖排菜单。 首先,我们需要了解HTML的基本结构。HTML(超文本标记语言)用于定义网页的内容...