dai/6-logos-div.html

## 6-logos-div.html
<div class="animation-wrapper loaded ended">
	<canvas id="may-event-canvas" height="290" width="260"></canvas>
		<span class="visuallyhidden vo-subhead animated default hide-vo">
		Curved paper in green, yellow, orange, and blue forms the Apple logo. Inside the logo, a creator’s hand holds an Apple Pencil positioned to draw. The tip is pressed into the bottom of the logo, springing forth lively splashes of orange and pink that ripple upward. The creator spins Apple Pencil between thumb and forefinger. A swirl of pink, orange, and white droplets follow the twirling motion, and the movement causes the paper to gently flutter. The stem of the Apple logo is a droplet of pink, blue, and purple that floats above. When a user holds the pointer over the logo, an animated eraser effect is initiated. As the user swipes, the content below it disappears as if a paintbrush is erasing the logo in a sweeping motion. When more than 50 percent of the logo is erased, the logo morphs into a new logo — there are six designed logos in total. When less than 50 percent of the logo is erased, it reverts to the initial logo.
		</span>
		<span class="visuallyhidden vo-subhead animated watercolor">
		The previous logo has been erased and a new logo comes into view. Small circles in varying sizes in shades of light and dark blue, red, orange, green, and gray come together to form the Apple logo. The shapes have a watercolor effect, with a darker shade in the center and lighter shades in concentric circles rippling outward. The shapes are circular, with some completely round and some stretched into an oval shape. The circles appear in different formations. Some are larger and singular, and some are smaller and grouped together in rows of two, three, and four.
		</span>
		<span class="visuallyhidden vo-subhead animated air hide-vo">
		The previous logo has been erased and a new logo comes into view. Fun, lively squiggles in different shades of dark blue come together to form the Apple logo. The strokes bend, loop, and curl as if being created with spray paint and are accented with white, as if light is being reflected on them. Some of the squiggles overlap, showing a darker shade of blue where those sections cross.
		</span>
		<span class="visuallyhidden vo-subhead animated brush hide-vo">
		The previous logo has been erased and a new logo comes into view. Thick, textured paintbrush strokes in shades of green and white are drawn together to form the Apple logo. The strokes are wavy and textured, as if the creator applied different shades of dark green, light green, and white to the bristles before making the strokes. The strokes are curled to represent the curved angles produced by a paintbrush.
		</span>
		<span class="visuallyhidden vo-subhead animated calligraphy hide-vo">
		The previous logo has been erased and a new logo comes into view. Thin and thick calligraphy strokes in shades of dark and light blue elegantly loop and swirl together to form the Apple logo. The curved strokes resemble the script-like style of a calligraphy pen.
		</span>
		<span class="visuallyhidden vo-subhead animated oil hide-vo">
			The previous logo has been erased and a new logo comes into view. Droplets of a dark oil-like liquid stretch and swirl together to form the Apple logo. Once the shape is formed, the swirls develop into a shiny, iridescent combination of red, orange, and blue for an oil slick rainbow effect.
		</span>
		<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/hero/large.webm" id="may-event-hero" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000">/video>
		<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/watercolor/large.webm" id="may-event-watercolor" class="animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000"></video>
		<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/air/large.webm" id="may-event-air" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000"></video>
		<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/brush/large.webm" id="may-event-brush" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000"></video>
											<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/calligraphy/large.webm" id="may-event-calligraphy" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000">/video>
		<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/oil/large.webm" id="may-event-oil" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000"></video>
</div>

<!-- This code is extracted from public html, I assumes no responsibility -->
<!-- 緑、黄、オレンジ、青の曲線で描かれた紙がAppleのロゴを形作っている。ロゴの中には、Apple Pencilを持ったクリエイターの手が描かれている。先端がロゴの底に押し込まれ、オレンジとピンクの生き生きとした水しぶきが上に向かって波打つ。クリエイターは親指と人差し指の間でApple Pencilを回転させる。ピンク、オレンジ、白のしずくが渦を巻き、その動きが紙を優しくなびかせる。アップルのロゴの茎は、ピンク、青、紫のしずくとなって上に浮かんでいる。ユーザーがロゴの上にポインターをかざすと、アニメーションの消しゴム効果が始まる。ユーザーがスワイプすると、まるで絵筆でロゴを消すかのように、下のコンテンツが消えていく。ロゴの50％以上が消去されると、ロゴは新しいロゴに変化する。ロゴの50％以下が消去されると、最初のロゴに戻ります。 -->
	<div class="animation-wrapper loaded ended">
	<canvas id="may-event-canvas" height="290" width="260"></canvas>
	<span class="visuallyhidden vo-subhead animated default hide-vo">
	Curved paper in green, yellow, orange, and blue forms the Apple logo. Inside the logo, a creator’s hand holds an Apple Pencil positioned to draw. The tip is pressed into the bottom of the logo, springing forth lively splashes of orange and pink that ripple upward. The creator spins Apple Pencil between thumb and forefinger. A swirl of pink, orange, and white droplets follow the twirling motion, and the movement causes the paper to gently flutter. The stem of the Apple logo is a droplet of pink, blue, and purple that floats above. When a user holds the pointer over the logo, an animated eraser effect is initiated. As the user swipes, the content below it disappears as if a paintbrush is erasing the logo in a sweeping motion. When more than 50 percent of the logo is erased, the logo morphs into a new logo — there are six designed logos in total. When less than 50 percent of the logo is erased, it reverts to the initial logo.
	</span>
	<span class="visuallyhidden vo-subhead animated watercolor">
	The previous logo has been erased and a new logo comes into view. Small circles in varying sizes in shades of light and dark blue, red, orange, green, and gray come together to form the Apple logo. The shapes have a watercolor effect, with a darker shade in the center and lighter shades in concentric circles rippling outward. The shapes are circular, with some completely round and some stretched into an oval shape. The circles appear in different formations. Some are larger and singular, and some are smaller and grouped together in rows of two, three, and four.
	</span>
	<span class="visuallyhidden vo-subhead animated air hide-vo">
	The previous logo has been erased and a new logo comes into view. Fun, lively squiggles in different shades of dark blue come together to form the Apple logo. The strokes bend, loop, and curl as if being created with spray paint and are accented with white, as if light is being reflected on them. Some of the squiggles overlap, showing a darker shade of blue where those sections cross.
	</span>
	<span class="visuallyhidden vo-subhead animated brush hide-vo">
	The previous logo has been erased and a new logo comes into view. Thick, textured paintbrush strokes in shades of green and white are drawn together to form the Apple logo. The strokes are wavy and textured, as if the creator applied different shades of dark green, light green, and white to the bristles before making the strokes. The strokes are curled to represent the curved angles produced by a paintbrush.
	</span>
	<span class="visuallyhidden vo-subhead animated calligraphy hide-vo">
	The previous logo has been erased and a new logo comes into view. Thin and thick calligraphy strokes in shades of dark and light blue elegantly loop and swirl together to form the Apple logo. The curved strokes resemble the script-like style of a calligraphy pen.
	</span>
	<span class="visuallyhidden vo-subhead animated oil hide-vo">
	The previous logo has been erased and a new logo comes into view. Droplets of a dark oil-like liquid stretch and swirl together to form the Apple logo. Once the shape is formed, the swirls develop into a shiny, iridescent combination of red, orange, and blue for an oil slick rainbow effect.
	</span>
	<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/hero/large.webm" id="may-event-hero" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000">/video>
	<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/watercolor/large.webm" id="may-event-watercolor" class="animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000"></video>
	<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/air/large.webm" id="may-event-air" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000"></video>
	<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/brush/large.webm" id="may-event-brush" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000"></video>
	<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/calligraphy/large.webm" id="may-event-calligraphy" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000">/video>
	<video src="https://www.apple.com/105/media/us/home/2024/edb7b915-c8ff-4941-afc7-7232281ef311/anim/oil/large.webm" id="may-event-oil" class="animation hide-animation" aria-hidden="true" playsinline="" data-inline-media="" data-load-timeout="5000"></video>
	</div>

	<!-- This code is extracted from public html, I assumes no responsibility -->
	<!-- 緑、黄、オレンジ、青の曲線で描かれた紙がAppleのロゴを形作っている。ロゴの中には、Apple Pencilを持ったクリエイターの手が描かれている。先端がロゴの底に押し込まれ、オレンジとピンクの生き生きとした水しぶきが上に向かって波打つ。クリエイターは親指と人差し指の間でApple Pencilを回転させる。ピンク、オレンジ、白のしずくが渦を巻き、その動きが紙を優しくなびかせる。アップルのロゴの茎は、ピンク、青、紫のしずくとなって上に浮かんでいる。ユーザーがロゴの上にポインターをかざすと、アニメーションの消しゴム効果が始まる。ユーザーがスワイプすると、まるで絵筆でロゴを消すかのように、下のコンテンツが消えていく。ロゴの50％以上が消去されると、ロゴは新しいロゴに変化する。ロゴの50％以下が消去されると、最初のロゴに戻ります。 -->