jQuery仿苹果导航菜单

最新推荐文章于 2021-06-03 08:23:46 发布
最新推荐文章于 2021-06-03 08:23:46 发布
阅读量187 收藏
点赞数
文章标签： javascript ViewUI

这是一款用jQuery实现的仿苹果的导航菜单，该导航菜单随着鼠标的滑过呈现出图标缩放的效果，就像苹果系统中的Dock Menu一样。

在线示例源码下载 来自：网页特效大全

iteye_3224
关注
jQuery做二级菜单动画
shuren1991的博客
04-05 1957
鼠标悬浮动态展出二级菜单在网页中非常常见，这里介绍如何用jQuery制作这种效果。相关的知识有： mouseover() mouseout mouseenter() mouseleave() hover() show() hide() 有JS基础的同学，遇到这个问题的时候，很容易就想到mouseover() mouseout 这两个事件。我最开始做这个题目用的也是这两个事件。jquery代码如
bingdou.net jquery ui仿WebQQ整合苹果菜单界面
06-02
可直接运行index.html观看效果，支持拖拽，支持多界面切换，支持侧边栏与桌面互相拖拽，支持文件夹功能等。
jquery 仿制苹果系统导航菜单
08-06
基于jquery做的网页版仿苹果系统导航菜单，效果非常流畅 华丽 不解释。。。 用法: 在页面头部标签<head></head>中加入下面的代码 <script type="text/javascript" src="js/jquery.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]–> 第一部分是JavaScript，第二部分是CSS样式表，第三部分是针对IE6.0的PNG的hack 。 不要忘记把下面的代码加入到<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> 把下面的代码加到合适的地方，比如头部或者底部（注意：span标签一定要在img标签后面） <a class="dock-item" href="#"><img src="images/home.png" alt="home" /><span>Home</span></a> 浏览器兼容性 我已经在IE 6, IE 7, Opera 9, Firefox 2, Firefox 3 and Safari 2上测试通过。
基于jQuery实现苹果Dock样式的菜单
weixin_34405925的博客
02-02 131
爱编程小编之前我们分享过相当数量的jQuery菜单了，今天要给大家带来一款Dock样式的jQuery菜单，用过苹果的朋友都知道，它的Dock菜单非常酷，配合漂亮的图标就更加绚丽了。效果图如下： 在线预览   源码下载 实现的代码。 html代码： &lt;div id="wrapper"&gt; &lt;img src="images/1.png" width="64"&...
jquery插件mac os 风格的导航栏
04-26
mac os 中的导航设计是最为用户津津乐道的，因此我们今天使用js特效来实现这个效果
苹果菜单（js+jquery+css控制）
06-03
苹果菜单（js+jquery+css控制）
Jquery四种苹果风格导航菜单(横向竖向向上向下)
05-24
Jquery四种苹果风格导航菜单(横向竖向向上向下),华丽，实用，方便。快捷。
仿苹果商店 html5效果,8个超炫酷仿苹果应用的HTML5动画
weixin_29243063的博客
06-03 768
苹果的产品一直以精美的UI著称，无论是软件应用还是硬件设备。本文主要分享了8个很不错的HTML5动画应用，这些动画正式模仿了苹果的各类应用，有焦点图、钟表、菜单等HTML5应用和jQuery插件，大家一起来欣赏吧。1jQuery/CSS3实现仿苹果的CoverFlow图片切换这次要分享的也是一款基于jQuery和CSS3的仿苹果CoverFlow图片切换应用，并且可以自定义添加图片，效果非常不错。...
jQuery二级伸缩菜单
welcome
05-13 198
先看看效果图 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t
jQuery导航栏下拉菜单的显示/隐藏 和有关动画的方法
qq_40576178的博客
11-24 3568
jQuery中导航栏下拉的显示和隐藏 有下面几组相对应的方法 1、普通效果（子菜单有点生硬） show() 显示下拉子菜单 hide() 隐藏下拉子菜单 toggle() 智能切换显示/隐藏（自动识别并切换下拉子菜单的显隐状态） 2、滑动效果（子菜单带有动画效果） slideDown() 下拉显示子菜单 slideUp() 收起隐藏子菜单 slideToggle() 智能切换显示/隐藏（自动识别并切换下拉子菜单的显隐状态） 3、淡入淡出效果（子菜单显示/隐藏带有透明度）
模仿苹果虚拟悬浮按钮（自动靠边、可浮现任何界面上）
01-12
模仿苹果虚拟悬浮按钮（自动靠边、、倒计时背景变暗、可浮现任何界面上）
jquery仿Mac导航菜单和可移动窗口特效代码
03-28
NULL 博文链接：https://domocafe.iteye.com/blog/1250571
jQuery仿苹果官网导航菜单特效
04-07
"jQuery仿苹果官网导航菜单特效"就是这样一个例子，它模仿了苹果官方网站的导航菜单，带给用户一种高端、简洁且功能强大的感觉。这个特效不仅具备了基本的导航功能，还加入了搜索效果和下拉显示的会员中心，为网站...
jQuery仿苹果apple官网导航菜单代码
06-05
【jQuery仿苹果apple官网导航菜单代码】是一种网页开发技术，主要使用JavaScript库jQuery来实现，旨在复制苹果官方网站的导航菜单风格。这个项目的核心是利用jQuery的动态效果和事件处理功能，为网页创建一个具有...
仿苹果MAC机桌面导航菜单：Css Dock Menu
程序员的天堂
03-21 966
菜单在顶部： &lt;!doctype html public "-//w3c//dtd html 4.0 transitional//en"&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt; new document &lt;/title&gt; &lt;meta http-equiv="content-type" content
jQuery仿苹果apple官网导航菜单特效代码
03-20
在仿苹果导航菜单中，jQuery将用于处理用户的交互，如鼠标悬停、点击等事件。 ### 2. 黑色质感设计 苹果官网的导航菜单以其深色背景和高亮文字著名，这种设计营造出高端、专业的视觉感受。在我们的仿制版本中，...
jQuery仿苹果apple官网导航菜单代码.zip
07-11
在本资源中，我们主要关注的是使用jQuery实现的仿苹果Apple官网导航菜单代码。这个代码库旨在为网页创建一个与苹果官方网站相似的导航菜单，它具有黑色的质感设计，同时还包含搜索功能和下拉显示的会员中心选项。...
仿iPhone的AssistiveTouch 悬浮辅助球工具
热门推荐
WILLIAM-HUAN 个人技术博客
05-12 1万+
用过iphone的朋友都知道，iPhone有个圆球辅助工具，它漂浮在你的手机屏幕(在任何APP之上)，你可以将它移动到任何地方，它叫做AssistiveTouch，本篇模拟该软件实现一个小案例，主要是实现它的界面，首先来看看实现的效果吧： 拖动小圆球： 点击弹出pop窗口： 为了让辅助工具一直悬浮在窗口之上，这里使用的机制是通过在程序初始化是，
jQuery特效大全：从导航到下拉菜单
19. **jQuery iPod-style Drilldown Menu**：模仿苹果iPod界面的逐级菜单，提供沉浸式用户体验。 20. **Simple jQuery Dropdowns**：简化版的下拉菜单实现，适用于快速集成和基础需求。 21. **jQuery & CSS ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值