layout/reftests/css-blending/mix-blend-mode-nested-976533.html

Fri, 16 Jan 2015 04:50:19 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Fri, 16 Jan 2015 04:50:19 +0100
branch
TOR_BUG_9701
changeset 13
44a2da4a2ab2
permissions
-rw-r--r--

Replace accessor implementation with direct member state manipulation, by
request https://trac.torproject.org/projects/tor/ticket/9701#comment:32

     1 <!DOCTYPE HTML>
     2 <head>
     3 	<style>
     4 		.parent {
     5 		  width: 200px;
     6 		  height: 200px;
     7 		  position: absolute;
     8 		  z-index: 1;
     9 			background-color: #00ff00;
    10 		}
    12 		.intermediate {
    13 			width: 100px;
    14 		  height: 100px;
    15 		  margin-left:50px;
    16 		  background-color: #ff00ff;
    17 		  mix-blend-mode: difference;
    18 		}
    20 		.child {
    21 		  width: 100px;
    22 		  height: 100px;
    23 		  margin-left:50px;
    24 		  background-color: #00ffff;
    25 		  mix-blend-mode: multiply;
    26 		}
    28 		body {
    29 			margin:0px;
    30 		}
    31 	</style>
    32 	<!-- Blending should happen as follows:
    33 				First, the child element should blend with the intermediate element, with
    34 				the multiply operator. Is should not blend with the parent directly.
    35 				Then, group formed by the blended child and the intermediate element should
    36 				blend with the parent as a single layer.
    37 	 -->
    38 </head>
    39 <body>
    40 	<div class="parent">
    41 		<div class="intermediate">
    42 	    <div class="child"></div>
    43     </div>
    44 	</div>
    45 </body>

mercurial