search

enyo / opentip

Opentip is an open source javascript tooltip based on the protoype framework.
http://www.opentip.org
1.25k stars 401 forks source link

tooltip jolt issue in MacOS Safari browser #59

Closed raj2907 closed 11 years ago

raj2907 commented 11 years ago

When the form first loads, and for a period afterwards, there are screen jolts each time a help icon is moused over. This issue is occurred only on MacOs Safari browser.

Below is the code i have used to open tool tip

$(img).opentip(title, { showEffect: 'blindDown', tipJoint: "top left", removeElementsOnHide: true, stem: true, target: true, tipjoint: ['center', 'top'], hideTrigger: "tip", hideTriggers: ["trigger", "tip"], showOn: "creation", hideOn: "mouseout", fixed: true, background: "rgb(234, 236, 240)", borderColor: "rgb(187, 187, 187)" });

please help me on this.

Regards, Raj.

enyo commented 11 years ago

Could you please post a screenshot and your MacOS + Safari version. Thx

raj2907 commented 11 years ago

MacOs version:10.7.5 Safarai browser version: 6.0.4 screen shot 2013-06-17 at 4 11 04 pm

enyo commented 11 years ago

What do you mean by screen jolt? Might it be caused by the tooltip sticking out of the browser window?

raj2907 commented 11 years ago

No it's positioning correctly, but Screen flickers on every tool tip item mouse over.

enyo commented 11 years ago

I'm really sorry but I have no notion of what could cause the behaviour you're describing (and I'm not quite sure what this behaviour concretely is).

Do you have a link where I could try it out?

raj2907 commented 11 years ago

I have uploaded website page copy on the below link globalpanda.versatile-soft.com/testtooltip.zip

Please to open the page in MacOs and mouse over the help icon, you will see page flickering.

enyo commented 11 years ago

Ok, now I see what you mean.

This is a webkit bug, and is caused by webkit switching between gpu and cpu rendering (as far as I could figure out).

If you set those properties on the container form, it will force webkit to always render on the gpu which will prevent the flickering:

#aspnetForm {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}