tgideas / motion Goto Github PK
View Code? Open in Web Editor NEWMotion is a javascript library based on Zepto for mobile
Home Page: http://tgideas.github.io/motion
Motion is a javascript library based on Zepto for mobile
Home Page: http://tgideas.github.io/motion
landscape 组件乱码了
网站上的预加载和(对话框、浮层)组件共用的时候 ,对话框和浮层组件的样式没调用。。
window.s3LT = new mo.Animation({
target: $('.s3_layer_lt'),
fillMode: 'forwards',
duration: 500,
iteration: 1,
keyframes: {
0: {'opacity': '0', easing: 'ease-in-out'},
100: {'opacity': '1'}
}
});
s3LT.on("end",function(){
window.s3LTBack = new mo.Animation({
target: $('.s3_layer_lt'),
fillMode: 'forwards',
duration: 500,
iteration: 1,
keyframes: {
0: {'opacity': '0', easing: 'ease-in-out'},
100: {'transform': 'translate3d(0,0,0)', easing: 'ease-in-out'}
}
});
})
第一个动画on end的时候再针对本身DOM初始化一个新的动画,此时head标签会无限插入新的animation
比方我循环图片img1到img10,通过Chrome的Network会发现不停的重复请求这10张图片。
slide.v2.0.js
line 47
var constructor = function(){
var mainFn = arguments.callee.prototype.init;
if (typeof(mainFn) == 'function' && arguments.callee.caller != me) {
mainFn && mainFn.apply(this, arguments);
}
};
arguments.callee is deprecated.
test environment
wechat version 6.3.15(android and ios)
motion.js not working on strict mode.
怎么让裁剪框不动,拖动图片(可放大缩小,最小不小过裁剪框)
我看croppie和cropper的API上都很清楚,区分裁剪框和容器
var vanilla = new Croppie(el, {
viewport: {
width: 300,
height: 300
},
boundary: {
width: 300,
height: 300
},
showZoomer: false,
// enableExif: true,
enableOrientation: true
});
vanilla.bind({
url: objectURL,
orientation: 6
});
vanilla.result({
type: 'blob',
size: {
width: 300,
height: 300
},
// format: 'jpeg',
// quality: 0.8
}).then(function (blob) {
// do something with cropped blob
});
$(element).cropper({
// width: 300,
// height: 300,
viewMode: 3,
dragMode: 'move',
autoCropArea: 1,
restore: false,
guides: false,
highlight: false,
cropBoxMovable: false,
cropBoxResizable: false,
aspectRatio: 1,
})
求使用 motion
的ImageEditor
的代码示例
请问一下PageSlide的事件如何绑定?
当slide自动循环播放的时候,第二屏的方向有bug
无法下载选择的组件求解
一个是手机那个图片旋转的动画,你们写死了Shine_landscapeAni,忘记改成从配置里面读取前缀了。所以如果前缀不是Shine,就没有动画了。
然后就是
window.addEventListener('DOMContentLoaded',function(){
setTimeout(function(){
landscape();
if(_this.option.init){
_this.option.init();
}
},50);
});
实在不知道为什么要这么写,直接
setTimeout(function () {
landscape();
}, 50);
感觉挺好的。
在ImageEditor处理图片上传的时候有这么一段代码self.trigger('beforechange') 但是,这个最终是用Zepto处理的,但是Like trigger, but triggers only event handlers on current elements and doesn’t bubble. 也就是说这个代码根本没啥用self是一个对象,不是一个DOM,请问下加上这个代码的原因,谢谢。
问题一:提示信息,横屏竖屏提示信息反了;
问题二:竖屏模式在进入竖屏时,首次进入页面会触发提示,二次旋转时恢复正常,首次进入横屏时,没有提示,二次旋转恢复正常,横屏模式同理
charset无法设置,默认为gb2312,可能会造成js文件乱码。
_this.option
,这个问题已经有PR了,在这里:#21原样式:
+'@-webkit-keyframes '+config.prefix+'_landscapeAni{0% {-webkit-transform:rotate(-90deg);}30% {-webkit-transform:rotate(-90deg);}70%{-webkit-transform:rotate(0deg);}100% {-webkit-transform:rotate(0deg);}}'
+'@keyframes '+config.prefix+'_landscapeAni{0% {transform:rotate(-90deg);}30% {transform:rotate(-90deg);}70%{transform:rotate(0deg);}100% {transform:rotate(0deg);}}';
应改为:
+'@-webkit-keyframes '+config.prefix+'_landscapeAni{0% {-webkit-transform:rotate(0deg);}30% {-webkit-transform:rotate(0deg);}70%{-webkit-transform:rotate(90deg);}100% {-webkit-transform:rotate(90deg);}}'
+'@keyframes '+config.prefix+'_landscapeAni{0% {transform:rotate(0deg);}30% {transform:rotate(0deg);}70%{transform:rotate(90deg);}100% {transform:rotate(90deg);}}';
该组件是不是不能再PC端网站上运行?
canvas操作
Lottery可以考虑放弃flash了,移动端的大转盘刮刮卡可以集成
Slide的切换效果太少了,可以增加点
能做个路由组件吗?
最新版微信,通过二维码识别进入的网页,只有有上传组件()点击会闪退,求快点修复,谢谢谢谢~~~
/**
* 导出base64 png数据
*/
_public.toDataPngURL = function (callback) {
var self = this;
// 去除编辑状态的元素
self.unSelect();
window.setTimeout(function () {
var data = self.canvas.toDataURL("image/png");
callback.call(self, data);
}, 1000 / self.config.fps)
}
自己再后面加了这个方法,不知道你们会不会觉得不好~~
提示mo.PCPrompt is not a constructor
能不能做个bower兼容呢?
bower install motion
我在下载页面打包下载了包含Zepto的全部组件的压缩版。
把http://tgideas.github.io/motion/component/demo/slide/demo5.html
这个页面除了js改为本地加载了以外原封不动的copy下来,然后运行没有效果,还在页面里多了一段vbscript
Function IEBinary_getByteAt(strBinary, iOffset)
IEBinary_getByteAt = AscB(MidB(strBinary, iOffset + 1, 1))
End Function
Function IEBinary_getBytesAt(strBinary, iOffset, iLength)
Dim aBytes()
ReDim aBytes(iLength - 1)
For i = 0 To iLength - 1
aBytes(i) = IEBinary_getByteAt(strBinary, iOffset + i)
Next
IEBinary_getBytesAt = aBytes
End Function
Function IEBinary_getLength(strBinary)
IEBinary_getLength = LenB(strBinary)
End Function
新增的组件都打包不了呢
chrome更新到最新版会报这个错误,需要更新zepto
自行打包:http://github.e-sites.nl/zeptobuilder/
所需模块:event ajax form ie detect fx fx_methods touch gesture detect
拖拽时候显示的半透明层并不是所有项目都必须~
这个组件怎么用啊 怎么找androidScheme iosScheme packageName
默认情况下第一屏向下拉不会拉到最后一屏,但是当disable(0) 再enable(0)的时候,第一屏可以拉到最后一屏。
是我使用的在线库版本问题还是一直存在?
var landscape = new mo.Landscape({
mode : "landscape",
txt : "blah blah"
});
显示时依然显示默认的文字 "为了更好的体验xxxxx"
官网下载页好像没有找到Audio组件,是在其他组件里面吗?
情景:
1、第一次插入A照片后,再一次插入A照片则无效。
2、第一次插入A照片,第二次插入B照片后再插入A照片则有效。
所以无法连续的插入同一张照片。
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.