[jira] Reopened: (TOMAHAWK-996) /schedule.HtmlSchedule/javascript/domLib.js causes flicker for :hover css in IE 7

["Peter Mahoney (JIRA)" <de...@myfaces.apache.org>]

     [ https://issues.apache.org/jira/browse/TOMAHAWK-996?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]

Peter Mahoney reopened TOMAHAWK-996:
------------------------------------


This change causes Javascript errors:

event is not defined
 if(event.type != 'mousemove')

domLib.js (line 535)


> /schedule.HtmlSchedule/javascript/domLib.js causes flicker for :hover css in IE 7
> ---------------------------------------------------------------------------------
>
>                 Key: TOMAHAWK-996
>                 URL: https://issues.apache.org/jira/browse/TOMAHAWK-996
>             Project: MyFaces Tomahawk
>          Issue Type: Bug
>          Components: Schedule
>    Affects Versions: 1.1.7-SNAPSHOT
>         Environment: IE7 (maybe lower as well, have not tested)
>            Reporter: Joost Schouten
>            Assignee: Grant Smith
>             Fix For: 1.1.7-SNAPSHOT
>
>         Attachments: domLib.js, domLib.patch
>
>
> The function domLib_getEventPosition(in_eventObj) in the /schedule.HtmlSchedule/javascript/domLib.js resource calls document.scrollLeft and document.scrollTop which causes css :hover selector to be lifted for a split second resulting in a flickering of the affected elements for which the :hover == true. Check the following link in IE and roll over the navigation a few times to see the flicker in action.
> flicker: http://www.jsportal.com/myfaces/flicker.html
> A minor change to the function moving the document.scrollLeft and document.scrollTop out of the onmousemove event function and into a seperate onscroll event function fixes the problem. I would suggest to change the domLib_getEventPosition(in_eventObj)  to the code shown at [1] . Note the added scroll track event listner as well.
> I look forward to seeing this implemented as I do use the schedule in combination with :hover extensively.
> Regards,
> Joost
> [1] new code.
> /**Keep track of the scroll values for IE outside of the mouseposition
>  * method, as calling doc.scrollLeft and doc.scrollTop will interfere with the css :hover and 
>  * will invalidate :hover for a split second causing a flicker. Now doc.scrollLeft and doc.scrollTop
>  * will only be called on a scroll, fixing almost all situations in which this flicker will occur
>  */
> var domLib_IE_scrollLeft = 0;
> var domLib_IE_scrollTop = 0;
> if (domLib_isIE)
> {
> 	window.onscroll = function(in_event)
> 	{
> 		if (typeof(in_event) == 'undefined')
>         	{
>             		in_event = event;
>         	}
> 		var doc = (domLib_standardsMode ? document.documentElement : document.body);
> 		domLib_IE_scrollLeft = doc.scrollLeft;
> 		domLib_IE_scrollTop = doc.scrollTop;
> 	}
> }
> function domLib_getEventPosition(in_eventObj)
> {
> 	if(event.type != 'mousemove')
> 		alert('event.type: ' + in_eventObj.type);
> 	var eventPosition = new Hash('x', 0, 'y', 0, 'scrollX', 0, 'scrollY', 0);
> 	// IE varies depending on standard compliance mode
> 	if (domLib_isIE)
> 	{
> 		// NOTE: events may fire before the body has been loaded
> 		eventPosition.set('x', in_eventObj.clientX + domLib_IE_scrollLeft);
> 		eventPosition.set('y', in_eventObj.clientY + domLib_IE_scrollTop);
> 		eventPosition.set('scrollX', domLib_IE_scrollLeft);
> 		eventPosition.set('scrollY', domLib_IE_scrollTop);
> 	}
> 	else
> 	{
> 		eventPosition.set('x', in_eventObj.pageX);
> 		eventPosition.set('y', in_eventObj.pageY);
> 		eventPosition.set('scrollX', in_eventObj.pageX - in_eventObj.clientX);
> 		eventPosition.set('scrollY', in_eventObj.pageY - in_eventObj.clientY);
> 	}
> 	return eventPosition;
> }

-- 
This message is automatically generated by JIRA.
-
You can reply to this email to add a comment to the issue online.