Object .gm-resize-trigger causes white block overlaying scrollable content on IE 11

[dnwhte]

On IE 11 the inserted (.gm-resize-trigger) is displayed as a white block overlaying the scrollable content. Adding visibility: hidden removes it, but I'm not sure if that breaks the 's functionality.

Seems to work fine on 9 and 10, but I have not tested anything over IE11.

[noeldelgado]

Thank you @danwhite85 , fixed in v1.4.1.

[yohannpoli]

Is this possible to reopen this issue please, have the same problem in 1.4.3

Check 65dc5b6

Any workaround ? Visibiltiy hidden does not do the trick?

Edit: after investigating, it seems that the problem come from the

<object> 

element, is this possible to remove it, and use

<div> 

for example?

[noeldelgado]

Hi @yohannpoli, in which browser are you having the issue?

Sadly, the object cannot be replaced with a div, the object is used to register the resize event and call the update method automatically, a div does not provide a resize event but the object does.

BTW, the resizer object was added on 1.4.0 and the latest patches (up to 1.4.3) has been for this feature specifically, so, how useful is this feature for you? trying 1.3.2 is an option?. If you use 1.3.2 you will have to call the update method manually whenever you add/remove content or when the dimensions are changed, which, IMO it gives you more control over what the lib does but it can be a problem depending on how structured your code is.

Personally, I’m still using 1.3.2 on my projects, also, I’m thinking about reverting the resizer-trigger feature and publish it as v2.0.0. It all depends on how useful this feature can be.

[yohannpoli]

Issue on Win 7 with IE11.

I'm already manually update the scrollbar after adding/removing content, that's fine but i have to update all Gemini scrollbars in document when i resize the window, i don't want to register and manually trigger them.

After checking your code:

var obj = document.createElement('object');
addClass(obj, [CLASSNAMES.resizeTrigger]);
obj.type = 'text/html';
var resizeHandler = this._resizeHandler.bind(this);
obj.onload = function () {
  var win = obj.contentDocument.defaultView;
  win.addEventListener('resize', resizeHandler);
};

, it seems that you attach the resize event in the object content document, why not, but it will do the same on current window, isn't it?

I will give a try to 1.3.2 version.

Thanks for your answer.

[noeldelgado]

@yohannpoli

I'm already manually update the scrollbar after adding/removing content, that's fine but i have to update all Gemini scrollbars in document when i resize the window, i don't want to register and manually trigger them.

1.3.2 will do that for you :), it registers the window.resize event and runs the update method. This was replaced on 1.4.0 with a different technique “Element resize detection” that’s why the object it’s been created and registering the event to contentDocument istead of the current window.