Multiple serious issues with internet explorer

Anything mentioned below is an issue we are facing with internet explorer and are working on other browsers normally.

We would appreciate any kind of help regarding these issues as we want to put out a high quality product for our very important client.

Issues

  1. The first thing I noticed it that sometimes the website doesn’t load like a normal website. Instead, text and the slider go flying around the screen. Doesn’t happen often but its still an issue.

  2. After the site loads, you notice the text on the revolution slider is not displaying correctly, specifically the letter ‘š’.

  3. When you start scrolling the website you see it’s not smooth at all. It feels like it’s lagging. It works normally on tablet and mobile sizes.

3.1. Also sometimes when scrolling, revolution slider appears over the accordions below.

4.Accordions are the next issue. When clicked they don’t work, instead, the revolution slider comes down and positions itself over the accordions.

4.1. When scrolling up and down the site goes back to normal.

4.2. The accordion never opens to show additional information as it should.

4.3. We switched the default accordion icons to custom ones, but they don’t work in IE, they work on Google Chrome.

4.4.The lines that seperate sections of accordions are supposed to be lined up with the text.

5.When hovering over the menu items on top of the page, the hover effect is sometimes very slow and doesn’t show the menu for a few seconds.

6.Another issue with the menu is that the background of it is transparent, instead of a gradient that is clearly visible on google chrome. (The gradient effect comes into place when you start scrolling downward).

Hopefully you will be able to help us out as this is very important for us and our trusted client.

Regards,
Luka

Hi Luka,

Thanks for reaching out.

First, may I know which IE version you’re using?

  1. I can’t reproduce it, the slider loads okay with proper layer and text positioning.

  2. Could be related to this https://answers.microsoft.com/en-us/ie/forum/all/ie11-grave-accent-doesnt-work/a5a6913d-d855-4355-81a4-6f32152ac00f. The loaded font is Advent Pro and it’s coming from Megamenu Pro plugin.

<link rel='stylesheet' id='megamenu-google-fonts-css' href='//fonts.googleapis.com/css?family=Advent+Pro%3A400%2C700&#038;ver=4.9.8' type='text/css' media='all' />

And you’re only using it within the slider, please make sure to enable Latin and Latin Extended option for that font. Example,

<link href="https://fonts.googleapis.com/css?family=Advent+Pro&amp;subset=greek,latin-ext" rel="stylesheet">

But I’m not sure how you’ll do that with Megamenu Pro plugin, I recommend contacting the plugin author.

  1. Yes, it’s smoothing on touch devices since it has built-in scroll easing effect as part of touch feature. Please try installing smooth scroll extension and test it again.

3.1) Please provide a video recording, I can’t reproduce this on my view.

  1. It’s working and opening, but it freezes first which give the impression that it’s not working. Please provide your admin login credentials in a secure note and I’ll check your slider setup.

4.1) The layout and content are normal, the issue is the video and not the slider. The slider doesn’t move, but the video background is upon scroll. We must find a way to fix the performance issue caused by the video. I use google developer tools to remove the video (not the entire slider) and the slider and accordion behaves normally.

4.2) It does open but freezes first, just click it and wait and it will open. But removing the video background improves its performance and the closing and opening of accordion became instant (at least on my view)

4.3) May I know what custom icon you’re adding so we could test it as well? That feature works on my installation.

4.4) Please change your custom CSS to this

.acc-line {
    margin-left: 20px!important;
    margin-left: auto !important;
}

That’s a glitch in IE, the 0px became AUTO which centers it. Setting it to AUTO then reset it and respects the 20px margin.

  1. It’s the performance issue cause by the slider and video and IE couldn’t handle it. Let’s check this once other issues related to slider and video is addressed.

  2. The builder doesn’t have color picker for gradients, the one you use is a custom one which doesn’t work on IE. It requires different styling for it to work.

Please use this tool http://www.colorzilla.com/gradient-editor/ to generate your preferred gradient, and make sure IE checkbox is toggled on. And copy the generated styling, it’s long compared to one or two lines which only works on some browser.

Thanks!

Here is the video quickly explaining the problems we are facing: (The gradient problem is resolved ) https://youtu.be/fQlLyqKL4QA

We disabled the revolution slider video but problems still remain. I also disabled the whole section where the slider is but the lagging scroll still remains. Only the jumping of the slider disappeared. We also uploaded the smooth scroll plugin but nothing changed.
We also checked latin and latin extended support in the slider settings and nothing changed.

The IE version we are using: 11.345.17134.0 and 11.431.16299.0. On the newer version the letter “š” is visible on revolution slider, but on the older it is not.

  1. We tried installing smooth scroll but it did not work
  2. As you wished we are sending you the credentials for the backend of the page

4.3. Its a png file. Here is the link to it: https://metronik.netx.si/wp-content/uploads/2018/08/Metronik-vas-partner-za-avtomatizacijo-in-proizvodno-informatiko-odpri-meni-crn.png - plus sign

https://metronik.netx.si/wp-content/uploads/2018/08/Metronik-vas-partner-za-avtomatizacijo-in-proizvodno-informatiko-zapri-meni-crn.png - minus sign

4.4. We tried your css but the issue remained, also the line moved to the center in chrome which it shouldn’t.

  1. The gradient we generated using the tool you provided worked, thanks!

Additional:

We tried uploading the .webm and .ogv files to slider revolution, we found no improvements.
I think you should know that the slider that is on the page was downloaded from the library of revolution sliders, it is called Youtube Hero and it was re-done to suit our needs. Maybe that is causing problems.

Hi Luka,

Sorry for the confusion, what I was saying is, the font is coming from Mega menu plugin but you also used it within the slider.

But I’m able to find the issue, the font-weight on your slider’s text is 600, but you didn’t enable the 600 for Advent Pro. I went ahead and activate that font-weight, should be okay now.

  1. As for smooth scroll, you have to enable it too after activating the plugin. You can do that in Admin > X > Smooth Scroll. I went ahead and enabled it.

  2. Before we continue, would you mind updating your cornerstone first? The theme is updated while cornerstone isn’t. I couldn’t do that since it’s live, and so you could backup your site before updating.

4.3) I see, what do you mean that it didn’t work? I checked and the icon is displaying okay with that PNG image.

4.4) Maybe it’s still related to outdated cornerstone, let’s update it first and I’ll continue checking.

Have you done creating a new slider, perhaps to check and compare? What I noticed is that the slider somewhat works like with a fixed positioning. And I can’t reproduce this issue on my own created slider, perhaps that demo contains some CSS that affect the rendering of the page.

Thanks!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.