Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Parallax v-parallax error using option 'src'

See original GitHub issue

Steps to reproduce

<v-parallax src="http://oxygennacdn3.oxygenna.com/wp-content/uploads/2015/11/18.jpg" height="300"></v-parallax>

This ‘v-parallax’ tag does NOT work if the source image is included inside the src tag.

Versions

Vuetify v. 0.12.0

What is expected ?

The image is expected to be seen on the entire content of the div in which it is added.

What is actually happening ?

Only HALF of it is shown, from the right side. Leaving an empty space…

Reproduction Link

To reproduce this, do not use the CSS ‘background: url(“XXX”)’, use the tag option src.

How do I fix this ? I need to add dymic images url. I don’t want to resort to CSS only.

Issue Analytics

State:
Created 6 years ago
Comments:6 (3 by maintainers)

Top GitHub Comments

4reactions

ghostcommented, May 25, 2017

THANKS YOU.

I updated the file in “node_modules” and it worked. (not recommended for now, but until it is pushed for npm update/upgrade, then I’ll stick with that).

Parallax loads properly on first page load.

0reactions

lock[bot]commented, Apr 16, 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please direct any non-bug questions to our Discord

Top Results From Across the Web

How to display the full image in v-parallax? - Stack Overflow

Setting the :src="" attribute to the correct image immediately, and choosing an image that is taller than wide worked. Share.

vue.js vuetify test-utils warning : Vue warn]: Invalid prop: type ...

When you require an file, it returns the data content of that file. For images it returns a Blob object. And since the...

vuetify Archives - Coding Beauty

We use v-parallax to create a parallax component. It has a src prop for specifying the URL of the image to use for...

Parallax component — Vuetify

The v-parallax component creates a 3d effect that makes an image appear to ... A parallax causes a shift in a background image...

Simple Parallax Scrolling Effect with jQuery - GitHub Pages

Download and include parallax.min.js in your document after including ... For data attributes, append the option name to data- , as in data-image-src=""...