Having a trouble loading an image in 'flux-parallax' component

[bcchoir1954dev]

my folder structure

src

• assets
  • images
    • sample.png
• views
  • Home.vue

and in Home.vue

<flux-parallax
     src="../assets/images/sample.png"
     style="height: 600px;"
     type="fixed"
></flux-parallax>

In the developer console, it says

Image ../assets/images/sample.png could not be loaded

I'm very new to VueJS and would like to know how to use this correctly.

[ragnarlotus]

Hello, use the public folder instead.

Chevk #72 for further info.

Regards!

[bcchoir1954dev]

I've tried it and it is working now. Thank you so much.

Regards!

[bcchoir1954dev]

I have another problem.

<flux-parallax
  src="/img/sample.jpg"
  style="height: 600px; filter: blur(2px) contrast(0.5);"
  type="fixed"
></flux-parallax>

When I write code as above, the result looks weird

I find out that the image I used is too small (the first image is used as a background of the parallax div and it is stretched to both side of the screen. The second image is fixed position but it isn't stretched to fit the screen.) I wanna ask if it is possible to auto stretching the image to fit the screen.

Regards

[ragnarlotus]

Hello, could you prepare a sandbox where I can understand better what you are trying to achieve? I'm not sure what is what you really want to do.

Regards

[bcchoir1954dev]

Hello,
Maybe this gif makes you understand the problem.

This is the image I used

I don't know whether I have done something wrong or not.

This is the code I wrote
Parallax.vue : https://pastebin.pl/view/57888bf5
ParallaxContent.vue : https://pastebin.pl/view/cb801597

Regards,
Peachy

[ragnarlotus]

Thanks a lot for taking some time to give me the example codes. I did a review and certainly there is a bug with images smaller than the component size.

I will release the fix within the next days

Thanks!

[ragnarlotus]

I just released a new version with the fix.

Let me know if any problem.

Thanks!