Canvas Support

Template shows blank page and transitions are also not working in Angular 4

3 replies·opened Jan 21, 2019
W
whaider06Jan 21, 2019

Hi,

I have encountered this issue while setting up landing page for my client using angular 4. In console there is no error and blank page is displayed. If i remove id="wrapper" then page is displayed but there is no transition and parallax slider. I am referring the code below:

<div id="wrapper" class="clearfix">

	<section id="slider" class="slider-element slider-parallax full-screen with-header force-full-screen clearfix">

		<div class="slider-parallax-inner">

			<div class="full-screen force-full-screen" style="background: url('assets/images/hangman-photo.jpg') center center no-repeat; background-size: cover;">

				<div class="container clearfix">
					<div class="emphasis-title vertical-middle center">
						<h1 data-animate="fadeInUp">Welcome to <strong>La Photone</strong></h1>
					</div>
				</div>

			</div>
		</div>

	</section>
</div>

I have tried to manually initialize semicolon init functions like so:

SEMICOLON.documentOnReady.init();
			SEMICOLON.documentOnLoad.init();

But no success, If you can help me setting up template in angular 4, i would be very grateful to you.
Thanks

S
SemiColonWebSTAFFJan 22, 2019

Hello,

Unfortunately, Canvas is currently not Angular compatible and we currently do not provide Support for Angular related Issue since it is out of scope of the Template.

To fix the issue with Blank Page, please find and delete/comment the following code in the js/functions.js File: 

SEMICOLON.initialize.pageTransition();

and add the following CSS Code: 

body:not(.no-transition) #wrapper { opacity: 1; }

This will definitely work fine.

Unfortunately, Page Transitions currently cannot be called manually, since the Page is Loaded in Window Load. You might have to consider setting up a Custom Preloader Transition on your Page for Angular.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

W
whaider06Jan 23, 2019

Thank you,

I would make the changes and I am sure it will solve blank page issue.
I would highly appreciate if you work on angular templates as well.

Have a great day,
Thanks

S
SemiColonWebSTAFFJan 23, 2019

Hello,

Thank You so much! We will definitely try working on the Angular Template in the Future Updates.

Do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have a Great Day!

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard