jQuery coveringBad 效果对比
Covering-Bad 是一个可拉动大小的元素,覆盖在原有的元素上面,从而两者进行对比。
在线实例
使用方法
- <div class="covered" data-passive="images/2.jpg" data-active="images/1.jpg">
- <div class="handle"></div>
- <div class="changeable"></div>
- </div>
- jQuery
- $(function() {
- $('.covered').coveringBad();
- });
参数详解
参数 | 描述 | 默认值 |
marginX | 拉手与左右边界的距离 | 30 |
marginY | 拉手与上下边界的距离 | 30 |
setX | 左边的位置 | 30 |
setY | 上边的位置 | 30 |
direction | 方向,可选 horizontal(水平方向)或 vertical(垂直方向) | horizontal |
jQuery coveringBad 效果对比的更多相关文章
- 腾讯用过的插件jQuery twentytwenty 效果对比
在线实例 左右对比 上下对比 使用方法 <div class="twentytwenty-container"> <img src="/api/ ...
- php开发面试题---jquery和vue对比(整理)
php开发面试题---jquery和vue对比(整理) 一.总结 一句话总结: jquery的本质是更方便的选取和操作DOM对象,vue的本质是数据和页面分离 反思的回顾非常有用,因为决定了我的方向和 ...
- css3线条围绕跑马+jquery打字机效果
原文地址:css3线条围绕跑马+jquery打字机效果 有图有真相,今天偶然看到了一种效果,仔细看了下,发现它是用css的clip+css3的动画实现的,简直叼.于是自己拿来了前一阵子写的打字机效果, ...
- JQuery动画效果
jquery动画效果常用方法 1.show()显示效果语法:show(speed,callback)Number/String,Function speend为动画执行时间,单位为毫秒.也可以为slo ...
- 分享5种风格的 jQuery 分页效果【附代码】
jPaginate 是一款非常精致的分页插件,提供了五种不同风格的分页效果,支持鼠标悬停翻页,快速分页功能.这款插件还提供了丰富的配置选项,你可以根据需要进行设置. 效果演示 源码下载 各个 ...
- 新鲜出炉的30个精美的 jQuery & CSS3 效果【附演示和教程】
新鲜出炉的30个精美的 jQuery & CSS3 效果[附演示和教程] 作为最流行的 JavaScript 开发框架,jQuery 在现在的 Web 开发项目中扮演着重要角色,它简化了 ...
- jquery动画效果---animate()--滚屏
jquery动画效果---animate()方法---W3school
- jquery 之效果
// jquery 之效果 .css()既可以获取值,如 .css('fontSize'), 又可以设置内置属性,既可用驼峰式,也可以用连字符版,如 .css('background-color', ...
- python 全栈开发,Day53(jQuery的介绍,jQuery的选择器,jQuery动画效果)
js总结 js: 1.ECMAScript5 ES5语法 2.DOM CRUD 获取 3种方式 id tag className //面向对象 对象 : 属性和方法 某个对象中 function $( ...
随机推荐
- 在seajs中使用require加载静态文件的问题
注意,在seajs中使用require加载静态文件时,必须使用常量,不能用变量.如果一定要用变量,请使用require.async var html = require("view/sys/ ...
- css压缩(一)
基于require.js的压缩,至于require.js,网上有比较权威的解说 RequireJS进阶(一) RequireJS进阶(二) RequireJS进阶(三) 目前我所做的项目是把各个模块下 ...
- AjaxUploader使用
一.简单上传(Simple Upload with Progress) <CuteWebUI:Uploader ID="ajaxUploader" runat="s ...
- 求拓扑排序的数量,例题 topcoder srm 654 div2 500
周赛时遇到的一道比较有意思的题目: Problem Statement There are N rooms in Maki's new house. The rooms are number ...
- 审核流(3)低调奢华,简单不凡,实例演示-SNF.WorkFlow--SNF快速开发平台3.1
下面我们就从什么都没有,结合审核流进行演示实例.从无到有如何快速完美的实现,然而如此简单.低调而奢华,简单而不凡. 从只有数据表通过SNF.CodeGenerator代码生成器快速生成单据并与审核流进 ...
- 3D全景!这么牛!!
如果你用过网页版的百度地图,你大概3D全景图浏览是一种怎样的酷炫体验:在一个点可以360度环顾周围的建筑.景色,当然也可以四周移动,就像身临其境. 全景图共分为三种: ①球面全景图 利用一张全景图围成 ...
- com.sun.org.apache.xerces.internal.impl.io.MalformedByteSequenceException: Invalid byte 2 of 2-byte
com.sun.org.apache.xerces.internal.impl.io.MalformedByteSequenceException: Invalid byte 2 of 2-byte ...
- 各种Camera,总有一款适合你(二)
在实际的项目开发中,一般需要程序抽象出一些在几何意义上有明确意义的参数,这样方便策划或美术在自己的机器上进行调试. 下面是一个可变参的地下城摄像机的简单实现: // 第三人称摄像机,平移和旋转会同时进 ...
- UVa11292
Problem C: The Dragon of Loowater Once upon a time, in the Kingdom of Loowater, a minor nuisance tur ...
- Javascript之旅(一)
Javascript之旅(一) 一.基础知识 基本语法 变量 数据类型 字符串 数组 对象 条件判断 循环 Map和Set iterable 为什么要学习JavaScript JavaScript 是 ...