tianyazjq110
- 浏览: 95464 次
- 性别:
- 来自: 深圳
-
文章分类
最新评论
-
kakamimika：
貌似不行吧
jquery读取xml文件示例 -
momofiona：
第二版本：http://dl.dropbox.com/u/ ...
popBaseball拖动插件分析
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="../../scripts/jquery-1.3.1.js" type="text/javascript">
</script>
<script type="text/javascript">
$(function(){
var page = 1;
var i = 4;
$("span.next").bind('click', function(){
var $v_content = $(this).parents("div.v_show").find('.v_content');
var $v_show = $(this).parents("div.v_show").find('.v_content_list');
var v_width = $v_content.width();
var len = $v_content.find('.v_content_list').find("li").length;
var pageCount = Math.ceil(len / i);
if (!$v_show.is(':animated')) {
if (page == pageCount) {
$v_show.animate({
left: '0px'
}, "slow");
page = 1;
}
else {
$v_show.animate({
left: "-=" + v_width
}, "slow");
page++;
}
}
$(this).parents(".v_caption").find(".highlight_tip").find("span").removeClass("current").eq(page - 1).addClass('current');
})
$("span.prev").bind('click', function(){
var $v_content = $(this).parents("div.v_show").find('.v_content');
var $v_show = $(this).parents("div.v_show").find('.v_content_list');
var v_width = $v_content.width();
var len = $v_content.find('.v_content_list').find("li").length;
var pageCount = Math.ceil(len / i);
if (!$v_show.is(':animated')) {
if (page == 1) {
$v_show.animate({
left: "-=" + v_width * (pageCount - 1)
}, "slow");
page = pageCount;
}
else {
$v_show.animate({
left: "+=" + v_width
}, "slow");
page--;
}
$(this).parents(".v_caption").find(".highlight_tip").find("span").removeClass("current").eq(page - 1).addClass('current');
}
})
})
</script>
</head>
<body>
<div class="v_show">
<div class="v_caption">
<h2 class="cartoon" title="卡通动漫">卡通动漫</h2>
<div class="highlight_tip">
<span class="current">1</span>
<span>2</span>
<span>3</span>
<span>4</span>
</div>
<div class="change_btn">
<span class="prev">上一页</span>
<span class="next">下一页</span>
</div>
<em><a href="#">更多>></a></em>
</div>
<div class="v_content">
<div class="v_content_list">
<ul>
<li>
<a href="#"><img src="img/01.jpg" alt="海贼王" /></a><h4><a href="#">海贼王</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/01.jpg" alt="海贼王" /></a><h4><a href="#">海贼王</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/01.jpg" alt="海贼王" /></a><h4><a href="#">海贼王</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/01.jpg" alt="海贼王" /></a><h4><a href="#">海贼王</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4>
<span>播放:<em>33,326</em></span>
</li>
<li>
<a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4>
<span>播放:<em>33,326</em></span>
</li>
<li>
<a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4>
<span>播放:<em>33,326</em></span>
</li>
<li>
<a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4>
<span>播放:<em>33,326</em></span>
</li>
<li>
<a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4>
<span>播放 <em>57,865</em></span>
</li>
<li>
<a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4>
<span>播放 <em>57,865</em></span>
</li>
<li>
<a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4>
<span>播放 <em>57,865</em></span>
</li>
<li>
<a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4>
<span>播放 <em>57,865</em></span>
</li>
</ul>
</div>
</div>
</div>
<div class="v_show" style="margin-top:8px">
<div class="v_caption">
<h2 class="cartoon" title="卡通动漫">卡通动漫</h2>
<div class="highlight_tip">
<span class="current">1</span>
<span>2</span>
<span>3</span>
<span>4</span>
</div>
<div class="change_btn">
<span class="prev">上一页</span>
<span class="next">下一页</span>
</div>
<em><a href="#">更多>></a></em>
</div>
<div class="v_content">
<div class="v_content_list">
<ul>
<li>
<a href="#"><img src="img/01.jpg" alt="海贼王" /></a><h4><a href="#">海贼王</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/01.jpg" alt="海贼王" /></a><h4><a href="#">海贼王</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/01.jpg" alt="海贼王" /></a><h4><a href="#">海贼王</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/01.jpg" alt="海贼王" /></a><h4><a href="#">海贼王</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4>
<span>播放:<em>33,326</em></span>
</li>
<li>
<a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4>
<span>播放:<em>33,326</em></span>
</li>
<li>
<a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4>
<span>播放:<em>33,326</em></span>
</li>
<li>
<a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4>
<span>播放:<em>33,326</em></span>
</li>
<li>
<a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4>
<span>播放:<em>28,276</em></span>
</li>
<li>
<a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4>
<span>播放 <em>57,865</em></span>
</li>
<li>
<a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4>
<span>播放 <em>57,865</em></span>
</li>
<li>
<a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4>
<span>播放 <em>57,865</em></span>
</li>
<li>
<a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4>
<span>播放 <em>57,865</em></span>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>
- test.rar (34.6 KB)
- 下载次数: 10
分享到：
发表评论
相关推荐
SlideUnlock(滑动解锁)是一款功能强大的手机加解锁和桌面快捷增强软件，具有炫彩百变的操作界面和强大的软件主题DIY扩展功能。加解锁方面提供丰富的加解锁方式，包括按键、触屏、距离感应器和重力感应器的辅助加解锁...
视频监控模块中，当选中某个视频监控窗口时，用户可以通过“色彩控制”区域的滑动条对视频窗口进行亮度、对比度、饱和度和色度的调整。色彩控制运行结果如图1.3所示。 图1.3 色彩控制 图像抓拍及生成监控录像 ...
媒体秀APP是一款基于android平台，可以实现多种媒体娱乐功能的多功能媒体娱乐APP。 主要功能如下： 1. 手机本地音乐播放。支持四种播放模式，支持后台播放，新增“我喜爱的”列表用于管理用户喜爱的歌曲。 2. 手机...
jQuery实现鼠标移到链接提示显示图片功能插件 jquery实现鼠标经过链接放大图片特效代码 jquery实用Banner大图片横向切换效果 jquery实用产品图片展示动感切换效果源码 jquery平滑交换真彩色的图片逐渐变为黑白图像的...
V7.3 2023.07.20 新功能 新增论坛帖子视频封面功能的默认首图功能，...优化自带的滑动验证的一个细节逻辑，修复极少情况下可能会出错的 bug 优化 IP 归属地显示，当只有国家没有省份和城市的时候直接显示国家 修复二
ShopCart组件1.avi 65_Vue项目_ShopCart组件2.avi 66_Vue项目_显示购物项列表.avi 67_Vue项目_解决列表显示的3个bug.avi 68_Vue项目_复习.avi 69_Vue项目_购物车动画.avi 70_Vue项目_购物车列表的滑动.avi 71_Vue...
9:采用Messenger的弹出滑动消息提示框. 10:下载管理,虚拟文件夹. 11:自动ping. 12:连接到搜索引擎. 13:自动报告bug,建议等. 14:宏功能. 15:自动同步文件夹. 16:保存加载任务. 17:计划任务. 18:单线程下载时不能创建...
33. jQuery实现鼠标移到链接提示显示图片功能插件 34. jquery实现鼠标经过链接放大图片特效代码 35. jquery实用Banner大图片横向切换效果 36. jquery实用产品图片展示动感切换效果源码 37. jquery平滑交换真...
个性化的变妆系统，让使用任意定制自己喜欢的皮肤效果4，视频窗口拖动完全认你行，无拘无束的使用感受5，结合浩海播放器原有各种功能，可以说让你的网络播放器使用感受达到一个新的高度:) （可能有些夸大但我们就是...
增加有新消息时用户语音短消息提示功能； 增加七种商品排序浏览功能 增加导航热门搜索关键词开关显示 增加商品尺码、颜色、数量选择订购 修复商品评论页Title错误描述信息 完善商品价格图标显示模块文件 完善购物车...
UBank的UBKAccessibilityKit ...在屏幕上显示触摸点，方便您在进行演示或录制视频时想要在屏幕上显示触摸和滑动。 使用“概述警告”功能突出显示检测到的警告 自定义前景色或背景色。 关于该项目 UBKAccessibility
1.PC后台新增改价功能。 2.图片压缩支持设定小于指定大小时不压缩。 3.自定义上传图片和上传视频组件可配置限制上传数量。 4.用户注册登录配置可设置是否显示微信登录以及绑定微信入口。(订阅号可隐藏微信登录入口)...
更新时间：2015-03-08 资费提示：免费版 当前版本：5.0.11.7 软件语言：中文软件类别：特效相机 软件大小：7.43 MB适用固件：4.0.3及更高固件 内置广告：没有广告 适用平台：Android 软件介绍 一种拍摄运动照片的...
小图标文本内容块 图文卡片内容块 色块卡片内容块 按纽 Buttons 常用按纽 按纽尺寸 按纽状态 按纽风格 图标按纽 组合按钮 动态按纽 功能按纽 导航栏 Nav Bar 常用水平导航栏 灰色背景...
27_Vue项目_使用svg显示加载中提示界面.avi 28_Vue项目_Star组件.avi 29_Vue项目_注册登陆功能演示说明.avi 30_Vue项目_登陆界面效果1_切换登陆方式.avi 31_Vue项目_登陆界面效果2_手机号检查.avi 32_Vue项目_...
增加一个网站后台地图 优化一下图片加水印功能 增加CK编辑器 增加定时任务 定时备份数据库 定时发文章 文章列表与内容页调用标签，可以自适应栏目的FID，即本栏目里的内容。 优化生成机制。单列表内容...
增加一个网站后台地图 优化一下图片加水印功能 增加CK编辑器 增加定时任务 定时备份数据库 定时发文章 文章列表与内容页调用标签，可以自适应栏目的FID，即本栏目里的内容。 优化生成机制。单列表内容...
4、原绑定用户功能写数据库时增加对轮班字段的写入，增加轮班设定页面，现在您可以为任何一个用户设定单独的签到方式了，例如，某团队在绑定同一个签到组的情况下，有些人可以只上午签到，有些人则可以下午签到，...
增加一个网站后台地图 优化一下图片加水印功能 增加CK编辑器 增加定时任务 定时备份数据库 定时发文章 文章列表与内容页调用标签，可以自适应栏目的FID，即本栏目里的内容。 优化生成机制。单列表内容...