Parallax doesn't appear

Hi,

I copied the Creative quickstart but it doesn't look like the demo page all. The graphics didn't appear as expected. Can someone advise?

Hi

Did you install the quickstart or not?
If not and you are just copying settings and content, you need to check code on the custom module "Frontpage header bottom" and "Frontpage header top".

Cheers

Hi

Did you install the quickstart or not?
If not and you are just copying settings and content, you need to check code on the custom module "Frontpage header bottom" and "Frontpage header top".

Cheers

Hi Seichinha, I couldn't install the Creative quickstart package, so I'm building step by step , but in the parallax side I'm lost , could you please advise me about where do I find the code to make parallax work, and if it is a copy/paste operation in a module to get the sample working or if anything else is required ?, I read the article about it but still is no clear for me how should I start.

Thank you !

Sure
To display parallax animation as we shown on our demo, you need to publish two custom module types using the following xhtml code.

Custom module on "header_top" position:

Code: Select all

<div class="gk-parallax gkp-background-top" data-area="0" data-height="808">
<div class="gk-parallax-wrap">
<div class="gkp-element gkp-cloud_back1" data-start="55%,53%" data-end="65%,45%">Cloud back I</div>
<div class="gkp-element gkp-cloud_back2" data-start="38%,53%" data-end="45%,50%">Cloud back II</div>
<div class="gkp-element gkp-birds" data-start="50%,50%" data-end="50%,75%">Birds</div>
<div class="gkp-element gkp-ballon2" data-start="70%,55%" data-end="88%,65%">Ballon II</div>
<div class="gkp-element gkp-cloud_front4" data-start="0%,90%" data-end="0%,75%">Cloud front IV</div>
<div class="gkp-element gkp-island" data-start="50%,60%" data-end="50%,130%">Island</div>
<div class="gkp-element gkp-crane1" data-start="60%,24%" data-end="60%,70%">Crane I</div>
<div class="gkp-element gkp-crane2" data-start="0%,66%" data-end="10%,135%">Crane II</div>
<div class="gkp-element gkp-crane3" data-start="95%,60%" data-end="95%,105%">Crane III</div>
<div class="gkp-element gkp-ballon1" data-start="22%,35%" data-end="80%,125%">Ballon I</div>
<div class="gkp-element gkp-ballon3" data-start="90%,35%" data-end="90%,95%">Ballon III</div>
<div class="gkp-element gkp-cloud_front1" data-start="90%,85%" data-end="90%,135%">Cloud front I</div>
<div class="gkp-element gkp-cloud_front2" data-start="25%,63%" data-end="25%,105%">Cloud front II</div>
<div class="gkp-element gkp-cloud_front3" data-start="10%,85%" data-end="10%,105%">Cloud front III</div>
</div>
<div class="gkp-responsive gkp-tablet">Tablet view</div>
<div class="gkp-responsive gkp-mobile">Mobile view</div>
</div>


Custom module type publish on "header_bottom" position:

Code: Select all

<div class="gk-parallax gkp-background-bottom" data-area="700" data-height="819">
<div class="gk-parallax-wrap">
<div class="gkp-element gkp-ballon4" data-start="10%,10%" data-end="80%,20%">Ballon I</div>
<div class="gkp-element gkp-ballon5" data-start="80%,60%" data-end="50%,40%">Ballon II</div>
<div class="gkp-element gkp-island" data-start="50%,-125%" data-end="50%,58%">Island</div>
<div class="gkp-element gkp-cloud_front1" data-start="90%,-30%" data-end="90%,35%">Cloud front I</div>
<div class="gkp-element gkp-cloud_front5" data-start="0%,-30%" data-end="0%,35%">Cloud front II</div>
</div>
<div class="gkp-tablet">Tablet view</div>
<div class="gkp-mobile">Mobile view</div>
</div>


That's it

Seichinha, thanks for the quick support ! that keeps me going!!

Seichinha Hello, I purchased the CREATIVE theme for joomla 2.5.17, I have not used the quick start file.
I can not get the parallax display in the "header_top" even copying the code you provided, where am I wrong?
My site is under construction (I'm recreating your demo) is called myoak.it to see the problem
Thank you!
Laura

RESOLVED, everything works correctly by following your instructions step by step. congratulations!
Laura