位置: 编程技术 - 正文

用jQuery实现优酷首页轮播图

编辑:rootadmin

推荐整理分享用jQuery实现优酷首页轮播图,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

大致介绍

看到了一个轮播图的思路,就想的自己动手实践一下,总体来说用jQuery实现起来简单多了

思路

思路其实非常简单,就是当点击图片下面的圆点或者图片两边的箭头时,让想要看到的图片走到它的位置,然后当前的图片和想要看到的图片按照一个方向运动就可以了

例如:我们点击第五个小圆点,让第五个图片跑到当前图片的后面,然后一起向左运动

当然了,如果你想要看前面的图片,让图片先跑到当前图片的左边,然后和当前图片一起向右运动

基本结构与样式

用jQuery实现优酷首页轮播图

然后我们用jQuery来设置初始图片的位置和小圆点的位置

自动轮播

先来看看定义的全局变量

设置nowPic是为了记录当前显示的图片,因为这个轮播图一共有三种触发图片切换的方法,所以这个变量是三个方法要共享的

设置canClick变量是为了防止用户在图片切换动画效果还未完成的时候在进行点击

点击小圆点

图片切换的方法都是一样的但是要注意,当点击小圆点时要清楚图片自动切换的定时器,在图片切换完成后,在设置自动切换的定时器

点击箭头

当点击箭头时,我们为了防止用户多次连续的点击,所以设置了canClick这个全局变量,当点击了箭头时,要首先判断是否有为完成的动画即canClick是否为true,如果为true,就将canCilck设置为false,防止再次点击箭头,然后进行图片切换的动画,同样不要忘了清楚定时器,最后当切换图片的动画完成时,animate()方法的回调函数执行,将canClick设置为true

总结

这个效果实现起来很简单,就是刚开始没有想到实现的思路。

标签: 用jQuery实现优酷首页轮播图

本文链接地址:https://www.jiuchutong.com/biancheng/374071.html 转载请保留说明!

上一篇:jquery.zclip轻量级复制失效问题(jquery2)

下一篇:基于jQuery实现滚动刷新效果(jquery滚动条滚动到指定位置)

  • SQL Server 数据库分离与附加 就这么简单!(sqlserver数据库和mysql区别)

    5. 在下图的分离数据库窗口中列出了我们要分离的数据库名称。请选中“更新统计信息”复选框。若“消息”列中没有显示存在活动连接,则“状态”列显示为“就绪”;否则显示“未就绪”,此时必须勾选“删除连接”列的复选框。

    6. 分离数据库参数设置完成后,单击底部的”确定”按钮,就完成了所选数据库的分离操作。这时在对象资源管理器的数据库对象列表中就见不到刚才被分离的数据库名称student_Mis了(如下图)。

    三、附加数据库

    1. 将需要附加的数据库文件和日志文件拷贝到某个已经创建好的文件夹中。出于教学目的,我们将该文件拷贝到安装SQL Server时所生成的目录DATA文件夹中。

    2. 在下图窗口中,右击数据库对象,并在快捷菜单中选择“附加”命令,打开“附加数据库”窗口。

    3. 在“附加数据库”窗口中,单击页面中间的“添加”按钮,打开定位数据库文件的窗口,在此窗口中定位刚才拷贝到SQL Server的DATA文件夹中的数据库文件目录(数据文件不一定要放在“DATA”目录中),选择要附加的数据库文件(后缀.MDF,如下图)。

    4. 单击“确定”按钮就完成了附加数据库文件的设置工作。这时,在附加数据库窗口中列出了需要附加数据库的信息(如下图)。如果需要修改附加后的数据库名称,则修改“附加为”文本框中的数据库名称。我们这里均采用默认值,因此,单击确定按钮,完成数据库的附加任务。

    完成以上操作,我们在SSMS的对象资源管理器中就可以看到刚刚附加的数据库student_Mis (如下图)。

    以上操作可以看出,如果要将某个数据库迁移到同一台计算机的不同SQL Server实例中或其它计算机的SQL Server系统中,分离和附加数据库的方法是很有用的。

    深入浅析SQL封装、多态与重载 面向对象1.类:众多对象抽象出来的2.对象:类实例化出来的3.类的定义关键字class4.类里面包含成员变量成员属性成员方法5.面向对象三大特性(1)封装

    在Sql Server中调用外部EXE执行程序引发的问题 一、先开启xp_cmdshell打开外围应用配置器—功能的外围应用配置器—实例名DatabaseEnginexp_cmdshell—启用二、解决方法usemasterExecxp_cmdshell'mkdird:csj" class="img-responsive" alt="SQL Server 数据库分离与附加 就这么简单!(sqlserver数据库和mysql区别)">

    SQL Server 数据库分离与附加 就这么简单!(sqlserver数据库和mysql区别)

  • MySQL优化之缓存优化(续)(mysql数据库内存缓存设置)

    MySQL优化之缓存优化(续)(mysql数据库内存缓存设置)

  • Win8电脑二级网页打不开的解决方法(台式电脑二级网页打不开怎么办)

    Win8电脑二级网页打不开的解决方法(台式电脑二级网页打不开怎么办)

  • 详解Linux系统中安装配置Samba服务器的步骤(linux 详解)

    详解Linux系统中安装配置Samba服务器的步骤(linux 详解)

  • 用Python写飞机大战游戏之pygame入门(4):获取鼠标的位置及运动(python编写飞机大战)

    用Python写飞机大战游戏之pygame入门(4):获取鼠标的位置及运动(python编写飞机大战)

  • 免抵退和免退税 区别 委托
  • 一般纳税人的增值税征收方式的特点是
  • 企业缴纳印花税通过什么科目
  • 银行回单可以跨年补录吗
  • 季度利润表不包括什么
  • 金税盘地区编号淄博
  • 什么是资金账簿印花税
  • 一般纳税人暂估成本的账务处理
  • 帮别人开票收税点怎么做账
  • 融资租赁开具的发票是货物还是租金
  • 长投损失了如何处理
  • 网上报税费用如何抵扣账务怎么处理?
  • 出售全资子公司合并报表怎么做
  • 发票上有个含税金额什么意思?
  • 营改增之后账务怎么处理
  • 港口建设费2021年归国家税务总局
  • 固定资产改造计入什么科目
  • 不动产测绘费谁交
  • 用于职工集体福利的外购货物可以抵进项税额吗
  • 生产人员社保计入哪个科目
  • 增值税专用发票丢了怎么补救
  • 虚开增值税简单例子
  • 政府会计财政拨款收入借贷方向
  • 华为鸿蒙系统如何刷机
  • Windows XP具有类似于Apple Aqua的秘密主题
  • uniapp小程序自定义tabbar在iOS手机上太高了
  • win10远程连接win7密码正确,无法登陆
  • js控件的监听事件怎么使用
  • 笔记本电池消耗大怎么办
  • 房地产开发企业土地增值税怎么计算
  • Obsidian:实现日记记录【设计并使用模板】
  • 浅谈php中其他类的使用
  • 时间序列转换
  • 快速查找附近的人
  • js栈堆的区别
  • 帝国cms怎么用
  • 电子税务局怎么注册
  • 往来款项的含义
  • 产品结转基本步骤有哪些
  • 甲供材入账
  • 交易性金融包括哪些
  • 以件数为印花税计税的有哪些
  • 保险理赔进项税额转出
  • 作废的发票也要交印花税吗
  • 主营业务收入借方什么意思
  • 备用金超过时间会怎么样
  • 出口退税对应的进项不能抵扣对吗
  • 农业免税企业开票有限额吗
  • 颁给供应商的奖项
  • 应收账款应付账款可以抵消吗
  • 备用金没有发票,只有支付凭证
  • 弥补亏损的会计处理
  • 事业单位对公账户和零余额账户一样么
  • 离岸银行账户开户
  • windows使用痕迹是指是什么
  • mysql5.0使用教程
  • xp系统如何清理缓存
  • linux图片编辑软件
  • windows tasks文件夹
  • linux那些事儿
  • debian7安装教程
  • windows10 命令行
  • windows10预览版怎么样
  • 惠普笔记本win8.1
  • win10系统onenote不能用
  • win7打开软件总提示错误怎么解决
  • canvas动态绘制简单gif
  • opengl arb
  • nodejs image
  • unity热更新方案
  • jquery删除当前元素
  • activity启动原理
  • 同源策略详解
  • 异地如何拨打12393
  • 深圳前海地铁站几号线
  • 北京税务部门需要党员吗
  • 价税分离有什么好处
  • 如果贸易后y产品的相对价格下降很大的话
  • 加强税务工作
  • 非居民企业通俗指
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设