leonardharley

Adding filter to body of page before or after chart is rendered blanks page

Recommended Posts

Hi,

 

We have a css class as follows:

.blur {
-webkit-filter: blur(1px);
filter: blur(1px);
}

 

This is applied to the body of the page when submitting data to the backend as follows:

$('#app-layout').addClass('blur');

 

The body of the page is defined as follows:

<body id="app-layout" class="blur" onload="removeBlur()">

 

The problem is that as soon as we apply the blur filter to the page it blanks the screen - regardless of whether the chart has been rendered or not.

 

Please advise.

 

Many thanks.

 

Len

Share this post


Link to post
Share on other sites

Hi,

 

I have provided you with the information to test on your end already, so I'm not sure what more you could want.

 

As I said above, we have a "blur" CSS class we apply to the body of the page and as soon as we do so regardless of whether the chart if rendered or not it just blanks the screen.

 

To replicate on your end create the following CSS class in a stylesheet:

.blur {
-webkit-filter: blur(1px);
filter: blur(1px);
}

 

Change the body tag of the page to give it an ID:

<body id="app-layout">

 

Place the div for a chart anywhere on the page as normal.

 

To see the problem apply the CSS class to the page like so using jQuery:

$('#app-layout').addClass('blur');

 

As soon as you apply the CSS class to the body tag the page will blank screen completely.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now