myfaces-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Joost Schouten (JIRA)" <...@myfaces.apache.org>
Subject [jira] Created: (TOMAHAWK-996) /schedule.HtmlSchedule/javascript/domLib.js causes flicker for :hover css in IE 7
Date Fri, 18 May 2007 10:08:16 GMT
/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.6-SNAPSHOT
         Environment: IE7 (maybe lower as well, have not tested)
            Reporter: Joost Schouten


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.


Mime
View raw message