js简版图片左右切换功能
function leftMove(obj,direction,lis){
var num = 0;
var liWidth = lis[0].offsetWidth;
setInterval(function(){
if(num<parseInt(liWidth/10)){
if(direction=="left" && obj.offsetLeft<0){
obj.style.left = obj.offsetLeft + 10 + "px";
num == parseInt(liWidth/10)-1 ? (obj.style.left = obj.offsetLeft + liWidth%10 + "px"):null;
}
else if(direction=="right" && obj.offsetLeft>-liWidth*(lis.length-1)){
obj.style.left = obj.offsetLeft - 10 + "px";
num == parseInt(liWidth/10)-1 ? (obj.style.left = obj.offsetLeft - liWidth%10 + "px"):null;
}
}
num++;
},10)
}
js简版图片左右切换功能的更多相关文章
- 极简的js点击组图切换效果
程序员进行前端开发时,时常要用到点击切换组图的动画效果,网上确实有很多此类插件,但是都很麻烦,乌糟糟无数代码,有那个看的时间,自己都能把功能写完了.在这里我提供一段极简的js点击组图切换效果代码,包含 ...
- JS 实现 Tab标签切换功能
Tab标签切换 效果图: HTML部分: <div class="wrap"> <ul id="tag"> < ...
- vue实现tab切换功能
最近用vue做一个页面的tab功能,经过一查找资料,没用路由,也没用动态组件,完美实现了tab切换功能,效果如下 下面是代码实现,这是模板 <article id="example&q ...
- tabs自动切换功能的实现
<html><head><!-- Bootstrap 核心 CSS 文件 --> <link rel="stylesheet" href= ...
- html+css+jQuery+JavaScript实现tab自动切换功能
tab1.html内容 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
- JS实现下拉菜单的功能
<!DOCTYPE html> <html> <head> <meta charset = "utf8"> <title> ...
- js、jquery实现列表模糊搜索功能
实现的搜索功能: 1. 可以匹配输入的字符串找出列表中匹配的项,列表框的高度跟随搜索出的列表项的多少改变 2. 可以点击某一项进行选中列表项 3. 可以按下上.下.回车键来控制列表项 4. 按下回车键 ...
- Vue + Element-ui实现后台管理系统(3)---面包屑 + Tag标签切换功能
面包屑 + Tag标签切换功能 有关后台管理系统之前写过两遍博客,看这篇之前最好先看下这两篇博客.另外这里只展示关键部分代码,项目代码放在github上: mall-manage-system 1.V ...
- 基于.NetCore开发博客项目 StarBlog - (14) 实现主题切换功能
系列文章 基于.NetCore开发博客项目 StarBlog - (1) 为什么需要自己写一个博客? 基于.NetCore开发博客项目 StarBlog - (2) 环境准备和创建项目 基于.NetC ...
随机推荐
- 【leetcode】Spiral Matrix(middle)
Given a matrix of m x n elements (m rows, n columns), return all elements of the matrix in spiral or ...
- .NET微信公众号开发-5.0微信支付
一.前言 在开始做这个功能之前,我们要做的第一件事情就是思考,如何做这个微信支付,从哪里开始,从哪里入手,官方的sdk说明什么的,有没有什么官方的demo,还有就是老板给我的一些资料齐全不,那些要申请 ...
- Oracle、SQL Server、MySQL数据类型对比
1,标准SQL数据类型 BINARY 每个字符占一个字节 任何类型的数据都可存储在这种类型的字段中.不需数据转换(例如,转换到文本数据).数据输入二进制字段的方式决定了它的输出方式. BIT 1 个字 ...
- 142. Linked List Cycle II
题目: Given a linked list, return the node where the cycle begins. If there is no cycle, return null. ...
- Java代码简化神器-Lombok
一.背景 前段时间在开源社区中发现了一个比较牛逼的简化Java代码的神器-Lombok,接着自己写了demo进行测试和练习,感觉真的很不错,特此分享给需要的小伙伴们~ 二.开发之前的准备 1.lomb ...
- iOS-运行时机制
这里的两篇运行时的文章感觉还不错. 收藏: 初识iOS运行时RunTime | // TODO: http://www.saitjr.com/ios/objc-runtime.html Objecti ...
- microsofr visual studio编写c语言
过程: 1.创建win32 控制台项目 文件->新建->项目->Visual C++ ->Win32 输入项目名称 选择项目保存位置 2.添加->新建如图
- 2014年十个优秀的免费CDN加速服务-国内和国外免费CDN
这是一篇总结近几年来网络上出现了各类免费CDN服务的文章,文章本来应该早就发出来的,但是因为近期的各种原因一直拖到现在.之前部落已经总结了近几年来的优秀免费空间,新手朋友不必在茫茫“网”海中寻找免费空 ...
- hdu 1711Number Sequence
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1711 数字KMP,原来还能这么用 #include<stdio.h> ],b[]; ]; ...
- Pyqt QSplashScreen启动画面
多大数应用程序启动时都会在程序完全启动时显示一个启动画面,在程序完全启动后消失.程序启动画面可以显示一些有关产品的信息,让用户在等待程序启动的同时了解有关产品的功能,也是一个宣传的方式.QSplash ...