유튜브 영상 추가

dalnim · Sep 22, 2024 · a13c744 · a13c744
1 parent 5d23ed6
commit a13c744
Showing 1 changed file with 112 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -309,8 +309,119 @@ <h2 class="display-3 fw-bold text-white mb-4 shuffle_title" data-aos="fade-up">A
         </section>
         <!-- Auto-Play Shuffle in Playlist wrapper end -->
 
+				<!-- Awesome wrapper start -->
+		<section class="pb-5 pt-95" id="gallery">
+			<div class="container my-md-4">
+				<h2 class="display-3 fw-bold text-dark mb-5 text-center awesome_sc" data-aos="fade-up">Awesome Screenshots</h2>
+			</div> 
+
+			<div class="container py-md-5">
+				<div class="row g-3 align-items-center">
+					<!-- First YouTube Video Column -->
+					<div class="col-12 col-lg-6 text-center" id="youtube" data-aos="fade-left">
+						<h3 style="visibility: hidden;">First YouTube Video</h3>
+						<div class="video-container">
+							<iframe
+								src="https://www.youtube.com/embed/sult1ZinovE?playlist=sult1ZinovE&loop=1&autoplay=1&mute=1"
+								title="YouTube video player"
+								frameborder="0"
+								allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+								allowfullscreen>
+							</iframe>
+						</div>
+					</div>
+
+					<!-- Second YouTube Video Column -->
+					<div class="col-12 col-lg-6 text-center" id="youtube" data-aos="fade-left">
+						<h3  style="visibility: hidden;">Second YouTube Video</h3>
+						<div class="video-container">
+							<iframe
+								src="https://www.youtube.com/embed/UHpZq1_ZioQ?playlist=UHpZq1_ZioQ&loop=1&autoplay=1&mute=1"
+								title="YouTube video player"
+								frameborder="0"
+								allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+								allowfullscreen>
+							</iframe>
+						</div>
+					</div>
+					<!-- First YouTube Video Column -->
+					<div class="col-12 col-lg-6 text-center" id="youtube" data-aos="fade-right">
+						<h3 style="visibility: hidden;">First YouTube Video2</h3>
+						<div class="video-container">
+							<iframe
+								src="https://www.youtube.com/embed/DrNUSDCpmrc?playlist=DrNUSDCpmrc&loop=1&autoplay=1&mute=1"
+								title="YouTube video player"
+								frameborder="0"
+								allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+								allowfullscreen>
+							</iframe>
+						</div>
+					</div>
+
+					<!-- Second YouTube Video Column -->
+					<div class="col-12 col-lg-6 text-center" id="youtube" data-aos="fade-right">
+						<h3 style="visibility: hidden;">Second YouTube Video2</h3>
+						<div class="video-container">
+							<iframe
+								src="https://www.youtube.com/embed/zW7AETSYZB4?playlist=zW7AETSYZB4&autoplay=1&loop=1&mute=1"
+								title="YouTube video player"
+								frameborder="0"
+								allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+								allowfullscreen>
+							</iframe>
+						</div>
+					</div>
+
+
+					<!-- Vertical YouTube Videos -->
+					<div class="col-12 col-md-4 text-center" id="youtube" data-aos="fade-up">
+						<h3 style="visibility: hidden;">Vertical  Video1</h3>
+						<div class="vertical-video-container">
+							<iframe
+								src="https://www.youtube.com/embed/lNkmVCsbkOc?loop=1&mute=1&autoplay=1&playlist=lNkmVCsbkOc"
+								title="GirlGang #dance #shorts #trend #girls #trio #matching #reveal #916house"
+								frameborder="0"
+								allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+								referrerpolicy="strict-origin-when-cross-origin"
+								allowfullscreen>
+							</iframe>
+						</div>
+					</div>
+
+					<div class="col-12 col-md-4 text-center" id="youtube" data-aos="fade-up">
+						<h3 style="visibility: hidden;">Vertical  Video2</h3>
+						<div class="vertical-video-container">
+							<iframe
+								src="https://www.youtube.com/embed/booggLaFWaI?loop=1&mute=1&autoplay=1&playlist=booggLaFWaI"
+								title="GirlGang #dance #shorts #trend #girls #trio #matching #reveal #916house"
+								frameborder="0"
+								allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+								referrerpolicy="strict-origin-when-cross-origin"
+								allowfullscreen>
+							</iframe>
+						</div>
+					</div>
+
+					<div class="col-12 col-md-4 text-center" id="youtube" data-aos="fade-up">
+						<h3 style="visibility: hidden;">Vertical  Video3</h3>
+						<div class="vertical-video-container">
+							<iframe
+								src="https://www.youtube.com/embed/nriKjNBIvOI?loop=1&mute=1&autoplay=1&playlist=nriKjNBIvOI"
+								title="GirlGang #dance #shorts #trend #girls #trio #matching #reveal #916house"
+								frameborder="0"
+								allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+								referrerpolicy="strict-origin-when-cross-origin"
+								allowfullscreen>
+							</iframe>
+						</div>
+					</div>
+				</div>
+			</div>
+		</section>
+        <!-- Awesome wrapper end -->
+
         <!-- Awesome wrapper start -->
-        <section class="py-5 pt-95" id="gallery">
+		<section class="py-5 pt-95" id="gallery1" style="display: none;">
             <div class="container my-md-4">
                 <h2 class="display-3 fw-bold text-dark mb-5 text-center awesome_sc" data-aos="fade-up">Awesome Screenshots</h2>
             </div>