<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<head>
<title>jCarousel Examples</title>
<link href="../style.css" rel="stylesheet" type="text/css" />
<!--
jQuery library
-->
<script type="text/javascript" src="../lib/jquery-1.4.2.min.js"></script>
<!--
jCarousel library
-->
<script type="text/javascript" src="../lib/jquery.jcarousel.min.js"></script>
<!--
jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="../skins/tango/skin.css" />
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
wrap: 'circular'
});
});
</script>
</head>
<body>
<div id="wrap">
<h1>jCarousel</h1>
<h2>Riding carousels with jQuery</h2>
<h3>Circular carousel</h3>
<p>
This example shows a simple circular carousel.
</p>
<ul id="mycarousel" class="jcarousel-skin-tango">
<li><img src="http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/75/199481072_b4a0d09597_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/57/199481087_33ae73a8de_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/77/199481108_4359e6b971_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/58/199481218_264ce20da0_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/69/199481255_fdfe885f87_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/60/199480111_87d4cb3e38_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/70/229228324_08223b70fa_s.jpg" width="75" height="75" alt="" /></li>
</ul>
</div>
</body>
</html>
- 大小: 52.2 KB
分享到：
相关推荐
3. 使用jQuery选择器选取ul列表，并调用jCarousel方法初始化插件，配置如自动滚动速度、是否循环等参数。 例如： ```javascript $(document).ready(function() { $('#mycarousel').jcarousel({ auto: 3, // 自动...
在这个项目中，`jQuery` 被用来实现两种关键功能：图片滚动（通过 `jcarousel` 插件）和局部图片放大镜效果（通过 `jqueryzoom` 插件）。下面我们将详细介绍这两个功能及其背后的原理。 1. **`jcarousel` 插件**：`...
93. 基于jQuery的横向无缝图片滚动插件jcarousel 94. 实用jquery焦点图源码2 95. 常用jQuery新闻焦点图片切换效果插件 96. 强大jQuery实现3D文字三维旋转效果代码下载 97. 很帅的jquery焦点图切换源码可用于...
93. 基于jQuery的横向无缝图片滚动插件jcarousel 94. 实用jquery焦点图源码2 95. 常用jQuery新闻焦点图片切换效果插件 96. 强大jQuery实现3D文字三维旋转效果代码下载 97. 很帅的jquery焦点图切换源码可用于产品...
93. 基于jQuery的横向无缝图片滚动插件jcarousel 94. 实用jquery焦点图源码2 95. 常用jQuery新闻焦点图片切换效果插件 96. 强大jQuery实现3D文字三维旋转效果代码下载 97. 很帅的jquery焦点图切换源码可用于产品...
1. 2款jQuery图片自动切换常用广告代码 2. jquery+css五屏焦点图淡入淡出+圆形按钮切换广告图片代码 3. jQuery+CSS实用图片收缩与...93. 基于jQuery的横向无缝图片滚动插件jcarousel **** …… …… …… 很多很多
要使用该插件，请包括jquery，jcarousel和jcarouselLazyLoading将源文件加载到HTML文档中： < script type =" text/javascript " src =" js/jquery.min.js " > </ script > < script type =" tex
49.jquery相册播放器插件实现无序图片列表转换成有序并播放 50.jQuery移动网页背景图浮云流水特效 51.jquery简单控制上下、左右四方向滚动的特效插件下载 52.jquery缩略图滚动特效之带小图的网页元素滚动轮播...
jCarousel则是一个灵活的jQuery插件，用于创建滚动或轮播图片列表。"jquery.jcarousel.css"包含了jCarousel的样式定义，包括滑块的外观、导航按钮、自动播放指示器等。"jqzoom+jcarousel.html"这个文件很可能是...
EasyNews 可能是一个用于显示新闻列表的 jQuery 插件。它可能支持自动更新和自定义样式等功能。 **3.4 jQZoom** jQZoom 是一个用于创建图片缩放效果的插件。它允许用户通过鼠标滚轮或点击来放大缩小图片，并且可以...
这个插件能够实现图片的向上、向下滚动，以及其他各种动态展示效果，使得网站的图像展示更加生动活泼。 ### 一、Jcarousel基本概念 1. **什么是Jcarousel？** Jcarousel是一个开源的JavaScript库，专门用于创建...
**jCarousel** 是一个流行的JavaScript库，用于创建可滚动、响应式的图像或内容滑块。这个压缩包"jcarousel_脚本实例_源码.zip"包含的资源是开发者用来理解和应用jCarousel脚本的实例代码和源代码。下面将详细探讨...
jQuery的许多插件如jCarousel或Slick可以帮助开发者轻松创建这种效果，支持触摸滑动，自动播放，多方向滑动等功能。通过CSS3的transform属性和transition属性，可以实现平滑的过渡效果。 “导航级联”是网页导航...
jQuery 社区提供了大量的插件，如用于图像轮播的 jCarousel，表单验证的 validate，以及响应式布局的 responsiveSlides 等。这些插件进一步扩展了jQuery的功能。 **9. 版本更新（Version Updates）** jQuery 1.10.3...
`jCarousel`是基于jQuery的一个优秀插件，专门用于创建高质量的轮播和滚动效果。它提供了丰富的自定义选项，可以轻松地调整滑动速度、方向、自动播放、导航箭头和指示器等多种特性。`jCarousel`的兼容性极佳，可以在...
2. **jquery.jcarousel.css**: 这个文件涉及到jQuery的轮播插件样式。jQuery是一个流行的JavaScript库，简化了DOM操作、事件处理和动画。jCarousel是jQuery的一个组件，用于创建可滑动的图片或内容轮播，常用于网站...
4. **jquery.jcarousel.min.js**：这是jQuery JCarousel插件的压缩版，用于创建响应式的图片或内容滚动列表，可以创建水平或垂直滚动的图像滑块。 5. **custom-form-elements.js**：这可能是一个自定义表单元素的...
3. **插件使用**：jQuery有许多现成的焦点图插件，如`jCarousel`、`bxSlider`等，它们提供了丰富的选项和API，可以直接应用到项目中，快速实现多方向滚动效果。理解这些插件的工作原理和配置选项对于定制效果至关...
1. prettyPhoto.css：这是一款流行的jQuery插件的CSS样式表，用于实现美观的图片弹出框效果，用户点击图片后，图片会在一个半透明的层上全屏显示，提供更好的图片浏览体验。 2. style.css、jCarousel.css、ie.css、...
这个名为"jcarousel"的压缩包可能包含一个JavaScript轮播图插件的源代码或文档，它可能涉及到DOM操作、事件处理、CSS动画、图片加载优化等相关知识点。通过学习这个插件，你可以了解到如何实现一个高效、流畅的图像...