Jump to content

EveR_

Member
  • Posts

    36
  • Joined

  • Last visited

Reputation Activity

  1. Like
    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 &amp; 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>
  2. Thanks
    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; } }  
  3. Thanks
    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; }  
  4. Like
    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

  5. Like
    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
  6. Like
    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
  7. Like
    EveR_ reacted to tuanphan in why my video is not showing?   
    Just answered
  8. Thanks
    EveR_ reacted to tuanphan in Pop-up code injection   
    Your site is private. Can you setup password & share url again? We can help easier
  9. Like
    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.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.