Closed Bug 302377 Opened 14 years ago Closed 10 years ago

flickering layouts css overflow:auto javascript movement

Categories

(Core :: Web Painting, defect)

defect
Not set

Tracking

()

RESOLVED FIXED

People

(Reporter: moxonite, Assigned: roc)

References

Details

(Keywords: testcase, Whiteboard: [widget-removal])

Attachments

(1 file)

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.2; es-ES; rv:1.7.8) Gecko/20050511
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.2; es-ES; rv:1.7.8) Gecko/20050511

in spanish:

Cuando muevo una capa con el attributo 'overflow:auto' por debajo de otras por
medio de javascript, las capas que quedan por encima reproducen un extraño
efecto de parpadeo en sus bordes a medida que la capa inferiror va moviendose

Reproducible: Always




<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>test</title>
  <style type="text/css">
  		body{
		margin:0px;
		padding:0px;
		border:0px;
		background-color:#000000;
		}
		#superior{
			position:absolute;
			top:40px;
			left:0px;
			width:300px;
			height:500px;
			background-color:#FFFF00;
			z-index:1;
			overflow:auto; /* remove this line to correct view */
		}
		
	
#barra1{position:absolute;top:0px;left:200px;height:100%;width:20px;background-color:#FF0022;z-index:2;}
	
#barra2{position:absolute;top:0px;left:250px;height:100%;width:20px;background-color:#FF0000;z-index:2;}
	
#barra3{position:absolute;top:0px;left:300px;height:100%;width:20px;background-color:#FF0000;z-index:2;}
	
#barra4{position:absolute;top:0px;left:350px;height:100%;width:20px;background-color:#FF0000;z-index:2;}
	
#barra5{position:absolute;top:0px;left:400px;height:100%;width:20px;background-color:#FF0000;z-index:2;}
	
#barra6{position:absolute;top:0px;left:450px;height:100%;width:20px;background-color:#FF0000;z-index:2;}
  </style>
  
  <script LANGUAGE="JavaScript">
  	var pos,divObj;
	
  	function mou(){
		divObj = document.getElementById("superior");
		pos = 0;
		temps();
	}
	
	function temps(){
		divObj.style.left = pos + "px";
		if(pos < 600){
			pos += 5;
			setTimeout("temps();",10);
		}
	}
  </script>
</head>
<body onLoad="mou();">

	<div id="superior"></div>
	
	<div id="barra1"></div>
	<div id="barra2"></div>
	<div id="barra3"></div>
	<div id="barra4"></div>
	<div id="barra5"></div>
	<div id="barra6"></div>
	
</body>
</html>
Attached file test example
Keywords: testcase
Assignee: dbaron → nobody
Component: Style System (CSS) → Layout
QA Contact: ian → layout
Assignee: nobody → roc
Component: Layout → Layout: View Rendering
QA Contact: layout → ian
Whiteboard: [widget-removal]
Status: UNCONFIRMED → NEW
Ever confirmed: true
here is a online example:

www.cotxarrera.com
No longer depends on: 316489
Blocks: 421866
Duplicate of this bug: 397736
Duplicate of this bug: 409366
Duplicate of this bug: 232714
Duplicate of this bug: 342338
Duplicate of this bug: 487912
This was fixed by bug 352093.
Status: NEW → RESOLVED
Closed: 10 years ago
Resolution: --- → FIXED
In Firefox 3.6 on the Mac: if there is a flash on the iframe page, the flash area is still causing this flickering as the iframe moves. This is the case with any wmode of the flash.
In last comment referring to the description of the flickering in bug 496735.
Component: Layout: View Rendering → Layout: Web Painting
You need to log in before you can comment on or make changes to this bug.