Canvas Support

Re: Angular Compatibility

1 reply · opened Jul 25, 2017

Kkk1429meJul 25, 2017

Hey guys,

Once again awesome themes. This post is a continuation of my previous post .

After tons of trial and error, I was able to make the website be up and running in Angular 4 . But now the issues that I am facing, lead me to believe that it's got something to with CSS and JS. Since JQuery is fully compatible with Angular 4, I don't see why I am having these issues, unless they are because I need to particularly wrap some JQuery functions inside Angular 4 and not keep them inside js/functions.js file. I have hosted the website so that you can inform me which JQuery functions are not working so that I can wrap them up in Angular 4.

These are the issues I will need help with:
1. The slider is not full screen, I dont know why :(.
2. The nav-bar and the header-bar collide with each other after scrolling.
3. The color of the header-bar should be white but is black.
4. The effects of the social-platform icons showing the social-platform name when we hover mouse over them in the nav-bar is not working.

_
I have come very close to making this website fully functional with Angular. Just small issues which I am sure you can help me with :)_

SSemicolon WebSTAFFJul 27, 2017

Hello,

Thank You so much for the Kind Words and your Patience! :) It is amazing to see that you are taking out valuable time to make Canvas compatible with Angular for your Projects!

Regarding the issues you are facing:

  1. The JS of Canvas runs on our API Structure which means you can re-initialize the JS easily. To enable the the Full Screen, you will need to call the SEMICOLON.initialize.fullScreen(); Function again.

  2. The Header is not reverting back to Non-Sticky after scrolling. Consider checking the SEMICOLON.header.stickyMenu(); Function, also we suspect that the Scroll Events are not properly getting executed.

  3. Again this is a Scroll Issue.

  4. This is related to jQuery which again might be missing execution.

All the Functions run within SEMICOLON.documentOnReady.init(); and SEMICOLON.documentOnLoad.init(); so you will need to recall them we guess.

Hope this Helps!

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

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