You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
60 lines
1.4 KiB
60 lines
1.4 KiB
<template>
|
|
<div class="slider" ref="stepper">
|
|
<div>
|
|
<a href="#" @click.prevent="step++">weiter</a>
|
|
</div>
|
|
<div>
|
|
aaaa
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data: function() {
|
|
return {
|
|
innerStep: 0,
|
|
slideCount: 2,
|
|
};
|
|
},
|
|
computed: {
|
|
step: {
|
|
set(index) {
|
|
var _self = this;
|
|
this.innerStep = index;
|
|
|
|
this.$nextTick(function() {
|
|
_self.$refs.stepper.scrollLeft = _self.$refs.stepper.scrollWidth / _self.slideCount * index;
|
|
});
|
|
},
|
|
get() {
|
|
return this.innerStep;
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
slideTo(e, index) {
|
|
if (e !== null) {
|
|
e.preventDefault();
|
|
}
|
|
|
|
var _self = this;
|
|
this.step = index;
|
|
|
|
if (index === 0) {
|
|
window.setTimeout(function() {
|
|
_self.value.kind = null;
|
|
}, 500);
|
|
}
|
|
|
|
jQuery('html, body').stop().animate({
|
|
'scrollTop': jQuery('#stepper-main').offset().top
|
|
}, 600, 'swing');
|
|
|
|
this.$nextTick(function() {
|
|
_self.$refs.slider.scrollLeft = _self.$refs.slider.scrollWidth / 4 * index;
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|