Welcome 微信登录

首页 / 脚本样式 / JavaScript

jQuery简单实现两级下拉菜单效果代码

jQuery简单实现两级下拉菜单效果代码

本文实例讲述了jQuery简单实现两级下拉菜单效果代码。分享给大家供大家参考。具体如下:这是一款两级下拉菜单,jquery插件版,在IE6/IE7/IE8下运行良好,在本示例中,菜单仅显示了四组,不过原理是一样的,菜单较长的话直接复制其中一组就行了,直到满足你的应用。运行效果截图如下:在线演示地址如下:http://demo.jb51.net/js/2015/jquery-simple-2l-slideout-menu-codes/具体代码如下:<!...
基于jQuery滑动杆实现购买日期选择效果

基于jQuery滑动杆实现购买日期选择效果

这是一款基于jQuery的滑动杆购买日期选择插件,它的外观仿的是阿里云的服务器购买日期选择界面。这款jQuery插件非常适合在一些虚拟产品购买页面上使用,它可以帮助你的用户快速选择产品的购买日期,十分方便。效果图如下:在线预览 源码下载html代码:<center><div class="slider-date" id="slider-date-"> <!--底层--> <ul class="slider-bg c...
JS+CSS实现带有碰撞缓冲效果的竖向导航条代码

JS+CSS实现带有碰撞缓冲效果的竖向导航条代码

本文实例讲述了JS+CSS实现带有碰撞缓冲效果的竖向导航条代码。分享给大家供大家参考。具体如下:这是一款碰撞缓冲效果的导航条,JavaScript妙味课堂奉献给大家的作品,很不错的竖向菜单,希望大家喜欢。所用技术是JS和CSS。运行效果截图如下:在线演示地址如下:http://demo.jb51.net/js/2015/js-css-pzxg-r-nav-style-codes/具体代码如下:<!DOCTYPE html PUBLIC "-//W3C...
jquery点击缩略图切换视频播放特效代码分享

jquery点击缩略图切换视频播放特效代码分享

本文实例讲述了jquery点击缩略图切换视频播放特效。分享给大家供大家参考。具体如下:jquery点击缩略图切换视频播放是一款非常实用的播放代码,点击视频缩略图切换优酷视频播放的视频播放选项卡代码,支持flash视频切换选项卡。运行效果图: -------------------查看效果 下载源码-------------------小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。为大家分享的jquery点击缩略图切换视频播放特效代码如下<!...
jQuery焦点图切换特效代码分享

jQuery焦点图切换特效代码分享

本文实例讲述了jQuery焦点图切换特效。分享给大家供大家参考。具体如下:这是一款网易保健品商城网站的jQuery焦点图代码,界面简洁、时尚、大方,通用性比较强,实现过程很简单。运行效果图: -------------------查看效果 下载源码-------------------小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。在head区域引入CSS样式:<link rel="stylesheet" href="css/zzsc.css...
JS实现带有抽屉效果的产品类网站多级导航菜单代码

JS实现带有抽屉效果的产品类网站多级导航菜单代码

本文实例讲述了JS实现带有抽屉效果的产品类网站多级导航菜单代码。分享给大家供大家参考。具体如下:这是一款像抽屉一样的菜单,多用在产品网站,比如IT产品网站的分类导航上,菜单结构清淅,样式新颖,设计美观,主要是运用JavaScript技术实现,用CSS配合实现菜单背景的构建,总体来说,是学习Js多级分类菜单的好范例。运行效果截图如下:在线演示地址如下:http://demo.jb51.net/js/2015/js-ct-style-product-web-n...
jquery图片轮播特效代码分享

jquery图片轮播特效代码分享

本文实例讲述了jquery图片轮播特效。分享给大家供大家参考。具体如下:这是一款仿淘宝首页jquery轮播焦点图,基于jquery实现仿淘宝网首页正中间小焦点图特效。运行效果图: -------------------查看效果 下载源码-------------------小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。为大家分享的jquery图片轮播特效代码如下<!DOCTYPE html><head><meta h...
jquery带有索引按钮且自动轮播切换特效代码分享

jquery带有索引按钮且自动轮播切换特效代码分享

本文实例讲述了jquery带有索引按钮且自动轮播切换特效。分享给大家供大家参考。具体如下:这是一款基于jquery实现的带有索引按钮且自动轮播切换特效代码,实现过程很简单。运行效果图: -------------------查看效果 下载源码-------------------小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。在head区域引入CSS样式:<link rel="stylesheet" href="css/reset.css" ...
jQuery实现可展开合拢的手风琴面板菜单

jQuery实现可展开合拢的手风琴面板菜单

本文实例讲述了jQuery实现可展开合拢的手风琴面板菜单。分享给大家供大家参考。具体如下:这是一款大家都常见的折叠菜单,手风琴折叠面板,会展开和合拢,带点Flash动画效果,修改时请注意:slideUp : 通过高度变化(向上减小)来动态地隐藏所有匹配的元素,在隐藏完成后可选地触发一个回调函数。这个动画效果只调整元素的高度,可以使匹配的元素以“滑动”的方式隐藏起来。slideDown: 通过高度变化(向下增大)来动态地显示所有匹配的元素,在显示完成后可选地...
JQuery实现图片轮播效果

JQuery实现图片轮播效果

【原理简述】这里大概说一下整个流程:1,将除了第一张以外的图片全部隐藏,2,获取第一张图片的alt信息显示在信息栏,并添加点击事件3,为4个按钮添加点击侦听,点击相应的按钮,用fadeOut,fadeIn方法显示图片4,设置setInterval,定时执行切换函数【代码说明】filter(":visible") :获取所有可见的元素unbind():从匹配的元素中删除绑定的事件siblings:取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素...
jQuery带进度条全屏图片轮播特效代码分享

jQuery带进度条全屏图片轮播特效代码分享

本文实例讲述了jQuery带进度条全屏图片轮播特效。分享给大家供大家参考。具体如下:jQuery实现的带进度条转接全屏图片轮播效果是一款基于jQuery实现的oppo手机官网首页带进度条全屏图片轮播特效代码,实现效果大气,简洁大方运行效果图: -------------------查看效果 下载源码-------------------小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。(1)在head区域引入CSS样式:link rel="style...
jQuery实现的淡入淡出二级菜单效果代码

jQuery实现的淡入淡出二级菜单效果代码

本文实例讲述了jQuery实现的淡入淡出二级菜单效果代码。分享给大家供大家参考。具体如下:这是一款加入了jQuery的菜单,一个看似平凡菜单突然有味道、有生机起来,这里将jQuery1.3.2引用进来,让弹出的二级菜单具备淡入淡出的效果,虽然就效果本身来说并不起眼,但比起无任何效果的菜单,从体验上来说,已经强了很多倍。运行效果截图如下:在线演示地址如下:http://demo.jb51.net/js/2015/jquery-fade-in-out-2l-n...
jQuery实现图片轮播特效代码分享

jQuery实现图片轮播特效代码分享

本文实例讲述了jQuery超精致图片轮播幻灯片特效。分享给大家供大家参考。具体如下:jquery图片轮播插件PgwSlider是一款非常简单的jquery插件,它可以帮你快速创建一个垂直轮播图。运行效果图:小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。(1)在head区域引入CSS样式:<link href="css/pgwslider.min.css" rel="stylesheet">(2)js代码:<script src=...
JS实现不规则TAB选项卡效果代码

JS实现不规则TAB选项卡效果代码

本文实例讲述了JS实现不规则TAB选项卡效果代码。分享给大家供大家参考。具体如下:这是一款不规则TAB选项卡效果,将中规中矩的方角换成了不规则的圆角,也就是这一换,倒让浏览者新鲜了不少,也使选项卡增多了几份灵感,不是吗?运行效果截图如下:在线演示地址如下:http://demo.jb51.net/js/2015/js-box-tab-nav-style-menu-codes/具体代码如下:<html><head><meta h...
jQuery实现的简单折叠菜单(折叠面板)效果代码

jQuery实现的简单折叠菜单(折叠面板)效果代码

本文实例讲述了jQuery实现的简单折叠菜单(折叠面板)效果代码。分享给大家供大家参考。具体如下:这是一款基于jQuery实现的折叠菜单,可展开一些内容,实际上称它为一个面板比较好,是一个折叠面板,使用了jQuery1.6.2插件。运行效果截图如下:在线演示地址如下:http://demo.jb51.net/js/2015/jquery-simple-toggle-zd-menu-codes/具体代码如下:<!DOCTYPE html PUBLIC ...
jQuery实现的超酷苹果风格图标滑出菜单效果代码

jQuery实现的超酷苹果风格图标滑出菜单效果代码

本文实例讲述了jQuery实现的超酷苹果风格图标滑出菜单效果代码。分享给大家供大家参考。具体如下:这是一款超酷苹果风格图标滑出菜单,调用了jquery1.3.2的库文件,整个菜单动感十足,用在网站上增色不少。运行效果截图如下:在线演示地址如下:http://demo.jb51.net/js/2015/jquery-apple-style-ico-show-menu-codes/具体代码如下:<!DOCTYPE html PUBLIC "-//W3C/...
<< 1181 1182 1183 1184 1185 1186 1187 1188 1189 1190 >>