Problems found so far
11003 opened this issue · comments
Do I have to upload different sizes?
After using the component, it should start to open and fail
Refresh is useful
<template>
<section>
<ProductZoomer :base-images="images" :base-zoomer-options="zoomerOptions"/>
</section>
</template>
<script>
import Vue from 'vue'
import ProductZoomer from 'vue-product-zoomer'
Vue.use(ProductZoomer)
export default {
data() {
return {
images: {
thumbs: [
{
id: 1,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/1.jpeg"
},
{
id: 2,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/2.jpeg"
},
{
id: 3,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/3.jpeg"
},
{
id: 4,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/4.jpeg"
},
{
id: 5,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/5.jpeg"
},
{
id: 6,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/6.jpeg"
},
{
id: 7,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/7.jpeg"
},
{
id: 8,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/8.jpeg"
},
{
id: 9,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/thumbs/9.jpeg"
}
],
normal_size: [
{
id: 1,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/1.jpeg"
},
{
id: 2,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/2.jpeg"
},
{
id: 3,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/3.jpeg"
},
{
id: 4,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/4.jpeg"
},
{
id: 5,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/5.jpeg"
},
{
id: 6,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/6.jpeg"
},
{
id: 7,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/7.jpeg"
},
{
id: 8,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/8.jpeg"
},
{
id: 9,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/normal_size/9.jpeg"
}
],
large_size: [
{
id: 1,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/1.jpeg"
},
{
id: 2,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/2.jpeg"
},
{
id: 3,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/3.jpeg"
},
{
id: 4,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/4.jpeg"
},
{
id: 5,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/5.jpeg"
},
{
id: 6,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/6.jpeg"
},
{
id: 7,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/7.jpeg"
},
{
id: 8,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/8.jpeg"
},
{
id: 9,
url:
"https://yoohooworld.com/assets/images/vue_product_zoomer/large_size/9.jpeg"
}
]
},
zoomerOptions: {
zoomFactor: 3,
pane: "pane",
hoverDelay: 300,
namespace: "zoomer-bottom",
move_by_click: false,
scroll_items: 4,
choosed_thumb_border_color: "#dd2c00",
scroller_position: "bottom",
zoomer_pane_position: "right"
}
};
}
};
</script>Question 3: Your project will not run after downloading, you can only see the effect by opening it directly in src/assets/drift-zoom/index.html
问题3：你的项目下载下来根本运行不起来，只能在src/assets/drift-zoom/index.html直接打开才能看到效果
i have same issue
class ="zoomer-bottom-base-container scroller-at-bottom" with issue css style "height:NaNpx;width:0px;position:relative"