tianyazjq110
- 浏览: 98203 次
- 性别:
- 来自: 深圳
-
文章分类
最新评论
-
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
分享到：
发表评论
相关推荐
本项目名为"DouyinDemo-master"，显然是一个模仿抖音短视频浏览体验的示例应用。下面将详细介绍如何在Android中利用RecyclerView和IjkVideoView来实现这一功能。 首先，RecyclerView是Android SDK提供的一种高效、...
本文将深入探讨如何创建一个具有横向滑动视频列表的Android视频播放DEMO，以及如何整合不同的组件和代码库以实现这一功能。 首先，我们要理解标题中的"Android视频播放DEMO，视频下方有横向滑动的视频列表"。这意味...
"仿抖音火山小视频滑动切换视频"是一个典型的案例，它涉及到Android开发中的多个技术要点，包括`RecyclerView`、`GravitySnapHelper`以及阿里云的视频播放SDK。下面将详细解释这些关键知识点。 1. **RecyclerView**...
标题“android 视频详情 评论 相关 滑动切换”暗示了这是一个涉及到视频详情展示、评论功能以及通过滑动操作在这些内容之间切换的应用示例。描述中提到这是一个基于Eclipse的完整Demo，意味着我们可以从源代码中学习...
一旦检测到当前项不再可见，我们需要停止当前视频播放，并预加载下一个视频，确保用户滑动到新位置时能立即播放。 核心计算代码可能包括以下部分： 1. 计算视图的可见性：可以使用`ViewTreeObserver`监听视图的变化...
在VB（Visual Basic）编程中，滑动条（Slider）控件是一种常用界面元素，它允许用户通过拖动滑块来选择一个介于最小值和最大值之间的数值。滑动条通常用于设置音量、亮度、进度等需要连续调整的参数。在本篇文章中，...
DDScrollViewController通过维护一个视图数组，并根据滑动方向动态调整视图的位置和索引，实现了这一功能。 二、DDScrollViewController特性 1. **自动滚动**：DDScrollViewController支持自动定时滚动，例如每几...
综上所述，实现“高仿微信小视频，小视频录制播放功能”是一个综合性的任务，需要掌握Android多媒体编程、UI设计、性能优化等多个方面的知识。通过学习和实践，我们可以创建出高效、稳定且用户体验良好的小视频应用...
滑动手机屏幕app是一款免费的安卓应用，可以解放双手的自动滑动点击工具，特别适用于刷短视频、看小说等场景，让你无需手动操作每次滑动，只需在应用内...必须先选择启用一个软件后，再去打开“启用功能”否则会闪退的
SlideUnlock(滑动解锁)是一款功能强大的手机加解锁和桌面快捷增强软件，具有炫彩百变的操作界面和强大的软件主题DIY扩展功能。加解锁方面提供丰富的加解锁方式，包括按键、触屏、距离感应器和重力感应器的辅助加解锁...
总的来说，这个压缩包提供了一个完整的滑动选项卡小程序项目，包括源码、视频教程、文档教程等，对于想要学习微信小程序开发，尤其是想掌握滑动选项卡实现的用户来说，是一份非常全面的学习资料。无论是安卓开发背景...
1. **SurfaceView**: SurfaceView是Android系统提供的一个用于显示动态图像的视图，它有自己的独立于应用主线程的渲染线程，适合处理CPU和GPU密集型任务，如视频播放和游戏。它的优点在于能避免UI阻塞，提高性能。 ...
"小程序商品详情轮播视频+图片" 的功能就是这样的一个设计，旨在为用户提供更加生动的商品展示方式。这一功能的核心是将视频与图片结合，通过轮播的形式展示在商品详情页，其中第一张通常是视频，后续则切换为图片，...
在微信小程序开发中，图片、视频和语音上传是常见的用户交互功能，对于提供丰富的用户体验至关重要。本文将深入探讨如何在微信小程序中实现这些上传功能。 首先，我们需要了解微信小程序的基础架构。微信小程序基于...
本视频教程将聚焦于如何在uni-app中实现一个自定义的图形滑块验证码功能，并结合后端PHP进行实际操作演示。 首先，图形滑块验证码是一种常见的用户验证手段，用于防止自动化程序（如机器人）对网站的恶意攻击。它的...
当用户触发上滑或下滑手势时，应用需要判断当前视频是否到达列表的边界，如果没有，则加载并播放下一个或上一个视频。这就涉及到视频数据的预加载和缓存策略。抖音通常会在后台预先加载一部分视频数据，这样当用户...
通过以上步骤，我们可以实现一个功能完备的微信小程序短视频切换组件。需要注意的是，实际开发中可能还需要考虑其他因素，比如视频加载优化、用户交互反馈、播放速度控制等，以提升整体的用户体验。
为了让功能更完善，你还需要定义一个` GestureDetector`来处理滑动手势，确保用户的手势被正确识别。同时，可能还需要考虑横竖屏切换的情况，确保在不同屏幕方向下，调整亮度和音量的逻辑依然正确。 此外，为了保持...
滑动条，作为一种常见的用户界面元素，广泛应用于各种操作系统和应用程序中，允许用户在预设范围内选择一个值或进行连续的交互。滑动条通常由两个部分组成：一个可拖动的手柄和一个表示范围的轨道。用户可以通过移动...