位置:设计主页 > 网站制作 > CSS教程 >

50个有用CSS3和jQuery教程演示

来源:设计前沿收集 作者:佚名 时间:2014-01-16 09:00

jQuery是一个轻量级的JavaScript库,强调互动JavaScript和HTML,也是以快速、简洁的JavaScript库数据简化HTML文档、事件处理、动画和Ajax等交互快速的进行web开发。CSS3和jQuery效果在大多数情况下的使用率是很高的。所以今天整理了50个有用CSS3和jQuery教程演示,希望从中 能给你带来帮助。

Experimental CSS3 Animations for Image Transitions

CSS3动画形象转换

instantShift - Experimental CSS3 Animations for Image Transitions

Live Demo Tutorial Link

CSS3 Image Styles

CSS3形象风格

instantShift - CSS3 Image Styles

Live Demo Tutorial Link

Parallax Content Slider with CSS3 and jQuery

滑块与CSS3和jQuery视差的内容

instantShift - Parallax Content Slider with CSS3 and jQuery

Live Demo Tutorial Link

3D Gallery with CSS3 and jQuery

3D画廊CSS3和JQUERY

instantShift - 3D Gallery with CSS3 and jQuery

Live Demo Tutorial Link

Fullscreen Slit Slider with jQuery and CSS3

全屏缝滑块jQuery和CSS3

instantShift - Fullscreen Slit Slider with jQuery and CSS3

Live Demo Tutorial Link

Flyout Image Slider Using jQuery & CSS3

jQuery和CSS3飞出图像

instantShift - Flyout Image Slider Using jQuery & CSS3

Live Demo Tutorial Link

Create a Stylish Image Content Slider in Pure CSS3

在CSS3中创建一个时尚内容滑块

instantShift - Create a Stylish Image Content Slider in Pure CSS3

Live Demo Tutorial Link

Sliding Image Panels with CSS3

滑动CSS3图像板

instantShift - Sliding Image Panels with CSS3

Live Demo Tutorial Link

Portfolio Flipping Slider Using jQuery & CSS3

组合使用jQuery滑块和CSS3

instantShift - Portfolio Flipping Slider Using jQuery & CSS3

Live Demo Tutorial Link

Impressive Product Showcase with CSS3

instantShift - Impressive Product Showcase with CSS3

Live Demo Tutorial Link

Create an Image Slider using jQuery and CSS3

instantShift - Create an Image Slider using jQuery and CSS3

Live Demo Tutorial Link

Fullscreen Background Image Slideshow with CSS3

CSS3图像 幻灯片背景

instantShift - Fullscreen Background Image Slideshow with CSS3

Live Demo Tutorial Link

Image Slider Controls With Nivo

instantShift - Image Slider Controls With Nivo

Live Demo Tutorial Link

Make an accordian style slider in CSS3

instantShift - Make an accordian style slider in CSS3

Live Demo Tutorial Link

Super Simple Lightbox with CSS and jQuery

instantShift - Super Simple Lightbox with CSS and jQuery

Live Demo Tutorial Link

CSS3 Lightbox Gallery With jQuery

instantShift - CSS3 Lightbox Gallery With jQuery

Live Demo Tutorial Link

Growing Thumbnails Portfolio

instantShift - Growing Thumbnails Portfolio

Live Demo Tutorial Link

Perfectly Rotate and Mask Thumbnails

完美旋转和缩略图组合

instantShift - Perfectly Rotate and Mask Thumbnails

Live Demo Tutorial Link

Responsive Content Navigator with CSS3

CSS3响应内容导航

instantShift - Responsive Content Navigator with CSS3

Live Demo Tutorial Link

3D Thumbnail Hover Effects

3D缩略图旋转效果

instantShift - 3D Thumbnail Hover Effects

Live Demo Tutorial Link

Classic Digg-Style Radio Buttons with CSS and jQuery

instantShift - Classic Digg-Style Radio Buttons with CSS and jQuery

Live Demo Tutorial Link

Create a Ribbon DropDown Menu with CSS3 and jQuery

创建一个下拉列表的CSS3和jQuery

instantShift - Create a Ribbon DropDown Menu with CSS3 and jQuery

Live Demo Tutorial Link

Create a stunning menu in CSS3

创建一个惊人的css3菜单

instantShift - Create a stunning menu in CSS3

Live Demo Tutorial Link

CSS3 & jQuery folder tabs

CSS3和jQuery文件夹选项

instantShift - CSS3 & jQuery folder tabs

Live Demo Tutorial Link

Vertical Navigation Menu

instantShift - Vertical Navigation Menu

Live Demo Tutorial Link

Creative CSS3 Animation Menus

instantShift - Creative CSS3 Animation Menus

Live Demo Tutorial Link

Google Play’s minimal tabs with CSS3 & jQuery

谷歌和CSS3和jQuery玩的最小的标签

instantShift - Google Play’s minimal tabs with CSS3 & jQuery

Live Demo Tutorial Link

Just another CSS3 menu

instantShift - Just another CSS3 menu

Live Demo Tutorial Link

How To Create a Pure CSS Dropdown Menu

如何创建一个纯CSS下拉菜单

instantShift - How To Create a Pure CSS Dropdown Menu

Live Demo Tutorial Link

CSS3 breadcrumbs

instantShift - CSS3 breadcrumbs

Live Demo Tutorial Link

Chunky 3D Web Buttons

厚实3D网页按钮

instantShift - Chunky 3D Web Buttons

Live Demo Tutorial Link

Interactive menu with CSS3 & jQuery

交互式菜单CSS3 & jQuery

instantShift - Interactive menu with CSS3 & jQuery

Live Demo Tutorial Link

Direction-Aware Hover Effect with CSS3 and jQuery

instantShift - Direction-Aware Hover Effect with CSS3 and jQuery

Live Demo Tutorial Link

Swatch Book with CSS3 and jQuery

instantShift - Swatch Book with CSS3 and jQuery

Live Demo Tutorial Link

Thumbnail Proximity Effect with jQuery and CSS3

instantShift - Thumbnail Proximity Effect with jQuery and CSS3

Live Demo Tutorial Link

Filter Functionality with CSS3

CSS3过滤功能

instantShift - Filter Functionality with CSS3

Live Demo Tutorial Link

Making a Page Flip Magazine

制作一个页面杂志

instantShift - Making a Page Flip Magazine

Live Demo Tutorial Link

Magnifying glass for image zoom using JQuery and CSS3

使用Jquery和CSS3放大镜的图像放大

instantShift - Magnifying glass for image zoom using JQuery and CSS3

Live Demo Tutorial Link

Item Blur Effect with CSS3 and jQuery

CSS3和jQuery模糊效果

instantShift - Item Blur Effect with CSS3 and jQuery

Live Demo Tutorial Link

Animated Web Banners With CSS3

CSS3动画网页横幅

instantShift - Animated Web Banners With CSS3

Live Demo Tutorial Link

Simple CSS3 border transition effects

简单的CSS3边界过渡效果

instantShift - Simple CSS3 border transition effects

Live Demo Tutorial Link

3D Flipping Circle with CSS3 and jQuery

3 d翻转圈CSS3和jQuery

instantShift - 3D Flipping Circle with CSS3 and jQuery

Live Demo Tutorial Link

Full CSS3 HTML5 Contact Form

完整的CSS3 HTML5接触形式

instantShift - Full CSS3 HTML5 Contact Form

Live Demo Tutorial Link

Flickr-Style Dynamic Edit Fields

动态编辑字段

instantShift - Flickr-Style Dynamic Edit Fields

Live Demo Tutorial Link

Typography Effects with CSS3 and jQuery

排版效果CSS3和jQuery

instantShift - Typography Effects with CSS3 and jQuery

Live Demo Tutorial Link

Apple-like Login Form with CSS 3D Transforms

类似与CSS 3 d变换登录表单

instantShift - Apple-like Login Form with CSS 3D Transforms

Live Demo Tutorial Link

Preserving vertical rhythm with CSS and jQuery

保持垂直与CSS和jQuery的节奏

instantShift - Preserving vertical rhythm with CSS and jQuery

Live Demo Tutorial Link

Timeline Portfolio

时间轴组合

instantShift - Timeline Portfolio

Live Demo Tutorial Link

Curving Text with CSS3 and jQuery

弯曲的文本CSS3和jQuery

instantShift - Curving Text with CSS3 and jQuery

Live Demo Tutorial Link

Get more out of your CSS transitions with jQuery

instantShift - Get more out of your CSS transitions with jQuery

Live Demo Tutorial Link