jq 自动滑动轮换(向后插入小块)

// JavaScript Document
var Marquee = {
arrIdObj : {/*marqueebox : {distance:-95,//移动距离delay:3000,//延迟时间speed:1000//移动时间},minCount:2 */},
//创建对象
startMarquee:function(){
//给参数赋值
if(this.arrIdObj != null && typeof this.arrIdObj === "object"){
for(var p in this.arrIdObj){
var obj = new classMarquee(document.getElementById(p),this.arrIdObj[p]);
}
}else{return null;}

function classMarquee(objElem,params){
var $objElem = $(objElem);
var Mparams = params;
//至少多少个
if(params.minCount > $(objElem).children().length){return null;}
//初始化
var t;
var b = false;
$objElem.mouseover(function(){b = true;});
$objElem.mouseout(function(){b = false;});
function start(){
$objElem.css("margin-top","0");
t = setTimeout(scrolling,Mparams.delay);
}
function scrolling(){
if(!b){
var styleVal = Mparams.distance +"px";
$objElem.animate({"margin-top":styleVal},Mparams.speed,"linear",function(){
$objElem.append($objElem.children()[0]);
start();
});
}else{
start();
}
}
start();
}
}
}

//自定义部分
Marquee.arrIdObj ={
marqueebox : {
distance:-95,//移动距离
delay:3000,//延迟时间
speed:1000,//移动时间
minCount:5
},
marqueebox1:{
distance:-121,//移动距离
delay:3000,//延迟时间
speed:1000,//移动时间
minCount:2
}
}
Marquee.startMarquee();

<ul id="marqueebox"><li></li><li></li><li></li><li></li><li></li></ul>

<ul id="marqueebox1"><li></li><li></li><li></li></ul>

时间: 2024-12-09 07:13:03

jq 自动滑动轮换(向后插入小块)的相关文章

仿优酷Android客户端图片左右滑动(自动滑动)

最终效果: 页面布局main.xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent

数组排序后插入

package com.bzjy.test;public class Test {    /**     * @排序插入     */    public static void main(String[] args) {        int[] b = { 4, 3, 1, 5, 8, 7, 2, 9 };        //显示原数组        show(b, "原");        //使用插入排序        show(sort(b), "排序")

探索Oracle之数据库升级七 11gR2 to 12c 升级完成后插入PDB

探索Oracle之数据库升级七 11gR2 to 12c 升级完成后插入PDB 前言:        从Oracle 12c开始,引入了容器数据库的概念,可以实现数据库插拔操作,如下图: 现在我们就来看看如何将11.2.0.4的数据库插入到12c的CDP里面去,让其成为一个PDB 数据库. 一.查看数据库信息: SQL> col BANNER format a80 SQL> set line 300 SQL> select * from v$version; BANNER CON_ID

ViewPager实现淘宝天面首页广告栏,支持左右滑动,自动滑动,带圆点指示器

原理:1.及根据当前viewpager的选中页面获取position,对其进行自增 2.之后调用:pager.setCurrentItem(currentpositon, true);进行页面切换 3.设置定时器每隔一段时间调用切换页面方法 核心代码如下: package com.dett.viewpagerautochange; import java.util.ArrayList; import java.util.Timer; import java.util.TimerTask; imp

用Python写个自动ssh登录远程服务器的小工具

很多时候我们喜欢在自己电脑的终端直接ssh连接Linux服务器,而不喜欢使用那些有UI界面的工具区连接我们的服务器.可是在终端使用ssh我们每次都需要输入账号和密码,这也是一个烦恼,所以我们可以简单的打造一个在Linux/Mac os运行的自动ssh登录远程服务器的小工具.来个GIF动画示例下先: 概述 我们先理一下我们需要些什么功能: 1. 添加/删除连接服务器需要的IP,端口,密码 2. 自动输入密码登录远程服务器 对,我们就做这么简单的功能 开始写代码代码比较长,所以我也放在在Github

swiper 窗口宽度变化,页面宽度高度变化 导致自动滑动 解决方案

又又又又是swiper问题 背景: pc端项目,rem布局,swiper作为步骤条(上一步,下一步)的功能. 发现在屏幕拖动,宽高的变化,窗口大小的变化 会引起swiper自动滑动(到下一步). 在下载文件链接时候回轻微引起一点点宽高的变化,导致直接滑到下一步. Chrome浏览关闭底部下载内容时候也会导致滑动 思考: 1.刚开始以为是某个地方不小心多加了下一步的操作,一直在查找 2.然后以为是下载的方法导致的,更换了多种下载方案 3.实在没有找出,准备debugger的时候发现,屏幕变化也会引

多张表中数据组合后插入新表的方法

以mysql为例. 遇到这个问题的时候最先想到的方法就是先从各个表中查询出相应的数据后使用程序循环遍历组装后在插入到数据库中.这是最直观的解决办法,但是这个方法处理超大结果集的时候就出现问题,例如:超出内存限制,运行时间过长等等... 这时使用另外一种方法应该会有帮助,那就是使用mysql的on duplicate key update方法来分步骤组合数据. 现在有3张表a,b,c.每个表的结构如下: a表包含字段:id,a,b,c: b表包含字段:aID,d,e,f:字段aID对应表a中的id

双击导航栏自动滑动ListView到顶部

有些app都实现了双击导航栏让页面的list自动滑动到顶部的feature. 先实现一个继承于OnTouchListener的监听多次点击事件的监听器,通过callback把连续点击的次数返回给客户代码,代码见gist:MultiTouchListener.java. https://gist.github.com/Viyu/d06eda19f9bcf7223f6b 然后给导航栏添加下面这个OnTouchListener的实现: OnMultiTouchListener mOnMultiTouc

自动切换输入焦点的一个小&quot;插件&quot;

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <style> form{ margin-bottom:10px; } form#inputs>input,form#inputs2>input,form#inputs3>input{ width:40px; height:40px; border-right-co