How to achieve parralax effect without using text over the image?

[Jakub78]

Hello,i would like to use parallax effect on homepage but when I do not use some form of text description the picture is very small in heights.When i insert text the picture gets stretched upwards.How can i achieve same effect without using text?

Thanks for your help.

Jakub

[Jakub78]

This reply has been marked as private.

[Ernesto]

Hi! Could you send us a screenshot of what you wish to accomplish?

Thanks in advance! Cheers!

[Jakub78]

Hi, here it is.
Basically without blockquote text the image gets squashed to let’s say 30px in heights and so far I have not find the way how to increase the size of image without help of text(blockqoute)which then stretches the image a lot.
I hope my explanation is kind of clear enough :),hope that screenshot helps, the second (smaller)screenshot is completely without any text/blockquote.

[Ernesto]

Hi! I’m terribly sorry, but the page right now seems to be offline. I’ll check it our in a couple of hours since it may be our problem and I’ll get back to you.

Cheers!

[Jakub78]

Hi,yeah ,you are right,not sure what is going on,but will find out.
My colleague messing with host i guess.

Typical

Hang on, please

Jakub

[Jakub78]

Hi,site is back online for you to check.

Jakub

[Ernesto]

Hi! Go to your Custom CSS Section and enter the following code:

#creativity-quote {width: 1140px;
height: 660px;} 
.parallax-banner blockquote {display: none}

Let us know if it worked out!

Cheers!

[Jakub78]

Hi Ernesto,
thanks, it works but the picture is not centered.i tried align it to the centre but without any luck.

Kind Regards

Jakub

[Jakub78]

Hi Ernesto,
I worked it out.here is the code I had to add to centre parallax image to the code the code you kindly provided:

display: block;
margin-left: auto;
margin-right: auto;

full code snippet is therefore(for someone who may also needed:)

#creativity-quote {width: 1920px;
height: 660px;
display: block;
margin-left: auto;
margin-right: auto; }

You will have to adjust width and height to your requirements of course.

Take care

Jakub

[Jakub78]

Cleaner version of code,I forgot to add one more line,which hides blockqoute :

#creativity-quote {
width: 1920px;
height: 660px;
display: block;
margin-left: auto;
margin-right: auto; }

.parallax-banner blockquote {display: none}

[Nexus]

Gald that all worked fine. Thanks for letting us know 🙂

[Author]

Posts