`
zhouyrt
  • 浏览: 1141828 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

图片播放(1)

 
阅读更多

一道题目,要求:在页面的固定区域内实现图片的展示

 

1 每点击一次右箭头,图片区域向左滚动出一张图片,反之相同;

2 当发现图片滚动到末尾时,响应的箭头变成不可点击状态;

3 鼠标在图片区域内滑动滚轮,图片会随着鼠标滚轮的方向进行响应的滚动;

4 当超过5秒没有任何交互操作时,进入自动滚动状态,间隔为5秒,到末尾时自动回到起始状态;

5 要求使用jQuery-1.6以上版本,遵循web开发规范,js文件以plugin组件方式封装或采用jQueryUI Widget方式封装;

6 可以使用原生JS开发,但要解决浏览器兼容问题,封装方式可参考CommonJS规范;

 

考核点:

1.       符合W3C标准

2.       实现功能与需求相符合

3.       命名规范合理、语义化

4.       代码结构清晰、简洁健壮,有良好缩进,可读性高

5.       代码质量优秀,含有大量开发技巧

 

 

这是原题,我使用了两种方式实现。一种原生JS,一种使用了jQuery。

  • 大小: 8.3 KB
分享到:
评论

相关推荐

    JS图片播放图片播放

    在JavaScript(JS)中实现图片播放功能是一项常见的需求,尤其在网页设计和开发中。图片播放器通常用于创建动态的、交互式的图像展示,能够帮助用户以更吸引人的形式浏览多张图片。以下是对这个主题的详细解释: 一...

    Delphi 图片滚动播放

    可以定义一个数组存储所有图片的路径,然后使用一个索引来跟踪当前显示的图片,每次定时器触发时,索引加1,如果超过数组长度,则重置为0,实现循环播放。 4. **图片的平滑过渡**: - 为了使图片切换更自然,可以...

    点击图片播放视频

    例如,它可能指导用户如何获取YouTube视频的嵌入代码,如何将该代码插入到HTML中,以及如何编写JavaScript来实现点击图片播放视频的逻辑。 总的来说,实现“点击图片播放视频”的功能涉及HTML的结构设计、...

    Jquery 炫酷图片播放

    "Jquery 炫酷图片播放"的主题,主要聚焦于利用jQuery来创建吸引人的图片展示效果,提升用户体验。在网站中,高质量的图片展示不仅能够吸引用户注意力,还能有效地传达信息。以下将详细讨论如何使用jQuery实现三种...

    Java 图片播放 音乐播放

    在Java编程环境中,实现图片播放和音乐播放的功能是一项常见的需求,尤其在开发多媒体应用程序时。以下将详细讲解如何使用Java来实现这些功能。 首先,针对“Java 图片播放”,Java提供了一些内置的类库,如`java....

    Java图片播放程序

    Java图片播放程序是一种基于Java编程语言开发的应用,用于展示和操控图像序列。它具备基本的播放功能,如正序播放、暂停以及逆序播放,使得用户可以流畅地浏览一系列图片,这对于教学、演示或者个人娱乐都有很高的...

    图片加播放按钮(含切换图片播放按钮)

    标题中的“图片加播放按钮(含切换图片播放按钮)”是指在图像元素上添加一个播放按钮,以便用户可以通过点击该按钮来启动或切换一组图片的动态展示,类似于幻灯片的效果。这种功能常用于产品展示、相册浏览或动态...

    QT打开图片文件夹快速播放图片

    首先,我们需要了解QT中的关键组件和类,这将是我们实现图片播放的基础。`QGraphicsView`和`QGraphicsScene`是QT图形视图框架的核心,它们允许我们以图形化的方式展示和操作对象。`QGraphicsPixmapItem`则可以用来...

    vb图片自动循环播放

    在VB(Visual Basic)编程环境中,我们可以利用PictureBox控件和Timer控件来创建一个图片自动循环播放的功能。这个程序设计适合于展示一系列图片,比如幻灯片、动态图像或者简单的动画效果。以下将详细讲解如何实现...

    PPT制作连续图片播放

    在PPT制作中,创建连续图片播放的效果是一种常见的需求,特别是在演示文稿中展示一系列相关图像或动画时。以下是对这个主题的详细说明: 1. **PPT的基础知识**:PowerPoint(PPT)是微软Office套件中的一个组件,...

    winform 图片和视频混合播放方法1

    "winform 图片和视频混合播放方法1"这个项目就提供了这样的功能,让我们来深入探讨一下实现这些功能的关键知识点。 首先,我们要了解Windows Forms中的图像处理。在Winform中,我们通常使用PictureBox控件来显示...

    js图片播放可以控制播放时间

    在JavaScript(JS)中,实现图片播放并控制播放时间的功能是一项常见的需求,尤其在动态展示图片、制作轮播图或幻灯片效果时。这里我们将深入探讨如何利用JS实现这一功能,并结合描述中的"adcode99"这个可能的代码库...

    c# 图片自动播放

    - 当用户点击“暂停”按钮时,停止计时器,暂停图片播放。 - 再次点击“播放”按钮时,恢复计时器,继续播放。 5. **图片停留时间设置**: - 可以使用`TrackBar`控件让用户调整图片停留时间,或者直接用`...

    简单易用的图片播放代码

    在本案例中,我们关注的是一个名为“简单易用的图片播放代码”的项目,它旨在模仿其他网站头部的图片切换效果,并且具有良好的浏览器兼容性,包括Internet Explorer(IE)、Firefox和Google Chrome等主流浏览器。...

    Qt循环播放一组图片

    在Qt框架下实现图片的循环播放是一项常见的任务,尤其在创建多媒体应用、动态展示或GUI界面设计时。本文将深入探讨如何使用Qt进行这一操作,同时考虑到不同分辨率的图片适应性。 首先,我们需要理解Qt中的关键组件`...

    3D图片播放网页特效

    在网页设计领域,3D图片播放特效是一种引人注目的技术,它能够为用户带来更加丰富和生动的视觉体验。这种特效通常结合了HTML5、CSS3以及JavaScript等技术,可以实现图片的立体展示,旋转,平移以及缩放等多种动态...

    播放图片的代码

    在IT领域,播放图片涉及到图像处理技术,这通常与编程语言和特定的库或框架相关。下面我们将深入探讨如何在代码中实现播放TIFF、BMP等格式的图片。 首先,我们要了解这两种图片格式。TIFF(Tagged Image File ...

    iOS视频图片混合轮播,支持视频播放和图片预览

    1. **图片轮播**:对于图片的展示,可以利用`UIImageView`类,它提供了加载本地或网络图片的能力。通过设置`UIImage`对象和利用`SDWebImage`或`Kingfisher`等第三方库,可以实现图片的缓存和异步加载,提高用户体验...

    图片循环播放,可设置循环播放时间

    反之,如果设置为假,图片播放将只进行一次。这个开关可能被封装在一个方法中,方便在运行时动态改变播放状态。 自定义播放布局是另一个重要的特性。在Android开发中,布局文件(XML)用于定义UI元素的位置和样式。...

    几十个图片播放效果集

    在IT行业中,图片播放效果是网页设计和用户体验中不可或缺的一部分。"几十个图片播放效果集"这个主题聚焦于展示各种JavaScript实现的图片轮换和播放技术。这些效果能够提升网站的视觉吸引力,使得图片展示更加生动...

Global site tag (gtag.js) - Google Analytics