taomas / vue-fullpage Goto Github PK
View Code? Open in Web Editor NEW一个实现fullpage.js功能的vue插件
一个实现fullpage.js功能的vue插件
根据后台返回的结果判断页面是否显示,现在这样会出现问题
第一个错误提示:Error in directive animate inserted hook: "InvalidCharacterError: Failed to execute 'add' on 'DOMTokenList': The token provided ('animate-[object Object]') contains HTML space characters, which are not valid in tokens."
第二个错误提示:Failed to execute 'add' on 'DOMTokenList': The token provided ('animate-[object Object]') contains HTML space characters, which are not valid in tokens.
找了半天也没找到问题出在哪儿!
You're demo doesn't seem to work. It's only showing one page.
api文档写的有点简单啊,与没有demo源码
怎么点击按钮,滚到下一屏
目前好像不支持PC端,怎么修改可以使得PC端都到支持呢?
First of all, sorry but I don't speak Chinese, and hope there are some English speakers here.
This is a very nice project, but is it possible to achieve the same behavior on a desktop: I would like the pages to change when I scroll my mouse, similar to swiping up / down on mobile.
您好,请问这个vue-fullpage 能适用于桌面端的鼠标滚轮吗?还是说只能是移动端的手势滑动?
请问有easing配置项么,是否可以通过贝塞尔函数来自定义添加滚动时的回弹效果?
fullpage.moveTo = function(curIndex, anim) {
var that = fullpage
var dist = that.o.dir === 'v' ? (curIndex) * (-that.height) : curIndex * (-that.width)
that.nextIndex = curIndex;
that.o.movingFlag = true
var flag = that.o.beforeChange(that.prevIndex, that.nextIndex)
if (flag === false) {
// 这里return前, 没有重置that.o.movingFlag, that.nextIndex, that.curIndex导致无法再次触发滚屏
return false;
}
if (anim) {
that.el.classList.add('anim')
} else {
that.el.classList.remove('anim')
}
that.move(dist)
window.setTimeout(function() {
that.o.afterChange(that.prevIndex, that.nextIndex)
that.o.movingFlag = false
that.prevIndex = curIndex
that.vm.$emit('toogle_animate', curIndex)
}, that.o.duration)
}
你好,
在你插件里面 fullpage.moveTo方法里面
that.vm.$emit('toogle_animate', curIndex)
绑定了事件,但是在触发事件的时候
` vm.$on('toogle_animate', function (curIndex) {
var curPage = +el.parentNode.getAttribute('data-id')
if (curIndex === curPage) {
that.addAnimated(el, aminate)
} else {
if (that.o.backcOp === false) {
el.style.opacity = '0'
that.removeAnimated(el, aminate)
} else {
}
}
})`
我在方法里面输出curIndex时,出现多次,我在html中添加了几个v-animate属性就会输出几次,这个事件要怎么理解呢?
不能向上滑动返回上一页吗?
前两屏没事,往后就滑不动了,需要滑动很大的距离才可以,在苹果app上的H5页面也有这个问题。有解决办法吗。
需要对touch事件调用preventDefault方法,阻止微信浏览器的后续操作.
能不能不要单击就换屏
链接都无法点击跳转了
只支持手机,不支持PC端,害人折腾了半天。作者是写自己用的吧,不考虑下大众的需求?
怎样在fullpage内部给元素添加点击事件
引用了vue-fullpage,下滑到第二页时,如果第二页的input框进行了v-model绑定,或者@click事件修改了vue实例里的值,会自己返回到上一页,很奇怪,一直没有找到解决的办法
不支持 scrollOverflow:true
pC端不可以么?
上下滑动的时候在 ios 端 上下晃动,又引入了其他插件才解决了这个问题...
Hi,
First of all, thanks a bunch for making this package, it works really well!
But I was wondering if you could make it possible to programmatically switch the section. For example: if you've got a button in the first section I'd like it to go to the next section upon clicking the button.
生产环节,加了
.page-container {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
可以充满整屏幕,但是npm run build 之后,生成的单页面,不能全屏
我想在ssr中使用该插件,但是报错了
ReferenceError: window is not defined
在微信中扫一扫打开时,iphone6滑屏时,上一页和下一页交换时会突然闪一下,然后才调到下一页。在iphone中使用微信扫一扫,它会打开自带的浏览器,而不是QQ浏览器,所以vue-fullpage是不是对IPhone自带的浏览器兼容性处理不够呢?
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.