EveR_
-
Posts
36 -
Joined
-
Last visited
Reputation Activity
-
EveR_ got a reaction from Beyondspace in When closing video popup, the audio from the video is still playing on the background and need to stop or pause.
Site URL: https://sapphire-poodle-5w36.squarespace.com/config/pages
The following is the code we used for a testimonial; the pop-up works fine but when one closes it and the video is not paused, the background sound will keep playing. Please help us close the video pop-up without any background sound (aka stop the video on the background automatically ).
The code is on the New Testimonial page https://sapphire-poodle-5w36.squarespace.com/config/pages
password: hello97
Thank you for your time!
<!DOCTYPE html>
<head>
<title>Creating a modal window with HTML5 & CSS3</title>
<style>
.modalDialogH {
position: fixed;
font-family: Proxima Nova, sans-serif;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0,0,0,0.8);
z-index: 99999;
opacity:0;
-webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
pointer-events: none;
!important>
}
.modalDialogH:target {
opacity:1;
pointer-events: auto;
}
.modalDialogH > div {
max-width: 80%;
height: 70%;
position: relative;
margin: 10% auto;
padding: 5px 20px 20px 20px;
border-radius: 10px;
background: #fff;
background: -moz-linear-gradient(#fff, #999);
background: -webkit-linear-gradient(#fff, #999);
background: -o-linear-gradient(#fff, #999);
}
.closeH {
background: #606061;
color: #FFFFFF;
line-height: 25px;
position: absolute;
right: 2%;
text-align: center;
top: 2%;
width: 24px;
text-decoration: none;
font-weight: bold;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
}
.closeH:hover { background: #00d9ff; }
h2
{
text-align:center;
}
</style>
</head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<body>
<a href="#Haruka M., Phillips Exeter Academy (USA)"><img src="https://i.ibb.co/5L3Q0vL/Haruka-Image.png" alt="Haruka-Image" border="0"style="position:relative; display: block;
margin-left: auto;
margin-right: auto;
width: 80%;"></a>
<a href="#Haruka M., Phillips Exeter Academy (USA)">Haruka M., Phillips Exeter Academy (USA) [VIDEO]</a>
<div id="Haruka M., Phillips Exeter Academy (USA)" class="modalDialogH">
<div>
<a href="#closeH" title="Close" class="closeH">X</a>
<h2 style="font-size:2.5vw;">Haruka M., Phillips Exeter Academy (USA)</h2>
<h2></h2>
<iframe width="100%" height="80%" src="https://www.youtube.com/embed/W27_K-9fpI8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div> </body>
-
EveR_ reacted to tuanphan in Urgent help: insert a video in pop-up window using this code
Don't remove above code.
Add this to Design > Custom CSS
/* Make Alex Title-Image clickable */ div#page-section-612c92cf4596654d5a16ed1e .span-4 { position: relative; } div#block-yui_3_17_2_1_1630399428610_3293 { position: static; } a[data-featherlight*="alex"] { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } a[data-featherlight*="alex"] center { position: absolute; bottom: 0; } /* Alex Popup on Mobile */ @media screen and (max-width:767px) { .featherlight-content { max-width: 85% !important; } }
-
EveR_ reacted to tuanphan in Urgent help: insert a video in pop-up window using this code
Try adding this to Design > custom CSS
/* Jiro Lightbox */ div[id*="Jiro"]>div { margin: 5% auto; max-width: 900px; max-height: 70%; overflow-x: hidden; } /* Alex */ div#bio-alex { padding: 2em !important; }
-
EveR_ reacted to tuanphan in Urgent help: insert a video in pop-up window using this code
With Jiro, you want to move it to top, make it not cut off?
https://mayflower-oriole-63kg.squarespace.com/home?noredirect
passw: hello97
-
EveR_ reacted to tuanphan in Urgent help: insert a video in pop-up window using this code
I see image only, no title in the page
https://mayflower-oriole-63kg.squarespace.com/home?noredirect
-
EveR_ reacted to tuanphan in Urgent help: insert a video in pop-up window using this code
Upload video to your site to get direct url. direct url needs format at the end of url, eg .mp4, .mp3,...
With Youtube, try this code
<div style="display:none;"> <div id="bio-alex"> <h3>Alex S., University of McGill, The American High School in Japan (Japan)</h3> <p style="font-family:Proxima Nova; font-weight:300; font-style:normal; font-size:16px; letter-spacing:0.02px; line-height:1.7em; color:hsl(0, 0%, 0%);" !important> "Throughout the summer of 2021, I was given the opportunity to work for two companies, DASH and CITEK, as well as a Ski Resort Fund. Working under DASH, a co-living business, we furnished an apartment building and set up the utilities and internet services for future residents. Furthermore, we managed the finances to identify all of the ordered, cancelled, and returned purchases. For the Ski Resort Fund, we created a presentation directed at potential investors about a potential Ski Resort fund to aid the struggling ski industry in Japan amidst the COVID-19 pandemic. Our main focus involved research, data analysis, and communication skills to present our findings regarding the market. For CITEK, a construction services company, we developed a homepage for potential clients and learned how to create an engaging and modern interface. From being involved in real world businesses to developing my data management and analysis skills, this internship under ConnectEd U has given me an invaluable experience." </p> <iframe width="560" height="315" src="https://www.youtube.com/embed/NFyxml7idZA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div> </div> To get iframe code >> access Youtube video >> Click Share >> Click Embed >> Copy code
-
-
EveR_ reacted to tuanphan in Pop-up code injection
Your site is private. Can you setup password & share url again? We can help easier
-
EveR_ got a reaction from Beyondspace in Code injection for a carousel
Site URL: https://tangerine-raccoon-5lw5.squarespace.com/config/pages
Hi everyone, thank you so much for taking some time to read this. I would like to create a carousel with images, with a title and a brief. Currently there are going to be 6 slides, and I was wondering if someone could help me code to do the following:
As someone hovers over it, a pop up window will appear on the screen to show a short description.
This is on the Home page.