I’m testing my new dev at the moment across mobiles and browsers. This development has taken advantage of BB’s brilliant ability to add a background images to rows - we have many!! and we love em!!
But in IE11 it is very jittery and jumpy, my school testers have all noted this - their browser of choice sadly is IE! It’s a bit off putting to the user. I have searched for a solution, and it seems it could be a long ongoing problem specific to IE.
Unfortunately with us going to WordCamp US this week, the update won’t be out until next Tuesday. I’m going to look at the issue tomorrow and see about providing a patch in the meantime. Stay tuned.
Unfortunately, after banging my head against this for a while, I still can’t find an elegant workaround. It appears that Microsoft has acknowledged the bug, but have yet to fix it in an update.
There is one workaround, the one you posted from CoderWall, but I’m hesitant to add that to the core builder since it’s not very elegant. However, that might be the only solution in this case. Can you try adding this to the JavaScript setting in the Customizer Code section?
if(navigator.userAgent.match(/Trident\/7\./)) { // if IE
jQuery('body').on("mousewheel", function () {
// remove default behavior
event.preventDefault();
//scroll without smoothing
var wheelDelta = event.wheelDelta;
var currentScrollPosition = window.pageYOffset;
window.scrollTo(0, currentScrollPosition - wheelDelta);
});
}
I tried a few of the JS suggestions but none worked. Should I be targeting the rows supporting the images, also changing the Z-index was mentioned, this bug has been around since 2013 as IE11 was built for win7, can only hope they address it soon…
Thanks for the detailed follow up. I realized that there is actually a core WoordPress issue in the Customizer with backslashes that may be affecting the code I posted. Can you try this…
if(navigator.userAgent.match(/Trident\\/7\\./)) { // if IE
jQuery('body').on("mousewheel", function () {
// remove default behavior
event.preventDefault();
//scroll without smoothing
var wheelDelta = event.wheelDelta;
var currentScrollPosition = window.pageYOffset;
window.scrollTo(0, currentScrollPosition - wheelDelta);
});
}
If that doesn’t work, would you mind sending temporary admin access?
My apologies for the delay. I logged in and it looks like there was an error in the JS that might have happened from the copy/paste. It should be working now. Can you give it a shot and let me know how it goes?
Thanks for taking the time to check and fix but I can’t see any difference, the jitter in IE11 is still there. Is this specific to this development as the fix does seem to work for others?
I had a closer look at that snippet and it looks like it’s firing before the page has loaded which is probably preventing it from working. I’ve adjusted it. Can you try clearing your cache and giving it another shot? Let me know how it goes.
Thanks for doing this and it did work briefly which was great, but I am having issues with the migration and some other IE problems, so had to delete the code to test compatibility then paste it back it - I thought I did this with precision from a text editor and it looked exactly the same when pasted back in but the background jitter has come back - can you tell me what you did so if i need to fix it again I know what to do?
I’ll send you the pre-production IP if you need to check.
I’ve fixed the issue on your new site, at least the IE fixed background one. Here is the complete code for future references.
jQuery( function() {
if(navigator.userAgent.match(/Trident\\/7\\./)) { // if IE
jQuery('body').on('mousewheel', function () {
// remove default behavior
event.preventDefault();
//scroll without smoothing
var wheelDelta = event.wheelDelta;
var currentScrollPosition = window.pageYOffset;
window.scrollTo(0, currentScrollPosition - wheelDelta);
});
}
});
Edit: The code above is only for when you use it inside the customizer. If it’s outside of it, just remove one backslash from the double backslashes, i.e., from (/Trident\/7\./) to (/Trident/7./).
Brilliant, thanks Ben (and Justin), that’s what I missed!
Just so you know, I’ve sorted my migration problem, there was an issue with missing postmeta (not images) because I installed php7.0 on the new server, when I rolled back to 5.6 it came back.
Migration process was made easy using the Interconnect S&R script.