Sunday, July 17, 2016

Javascript code to open a URL in a popup window


Pop-up windows that open on top of a current webpage. Depending on your coding, they may (not) require their visitor's request as a clickable link. Pop-up windows can host a wide variety of content types like opt-in forms for generating leads (read about a sales funnel), a promotional video, a news release, third-party advertisements that can earn the site owner money if visitors watch and so on.


Javascript code to open a URL in a popup window
This code will require the visitor to request the pop-up window via a clickable link.
  • Copy all of the code below. 
  • Replace only the highlighted section with your chosen URL.
--
--


<script type="text/javascript">

// Popup window code
function newPopup(url) {
popupWindow = window.open(
url,'popUpWindow','height=400,width=600,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no,status=yes')
}
</script>
<p><a href="JavaScript:newPopup('http://www.website.com');" title="">Open a popup window</a></p>








Javascript code to embed a Youtube video into a popup window
This code will require the visitor to request the pop-up window via a clickable link.
  • As pictured below, click the 'Share' tab in the 'Description' section of the Youtube video 

How to embed a Youtube video into a popup window - Javascript code

  • As pictured below, select the 'Embed' tab
  • The code will be highlighted in blue. Extract only the code that is a URL. Here is a closer look at the entire code and the section that should be extracted. Do not discard the entire code just yet.

    <iframe width="560" height="315" src="https://www.youtube.com/embed/xPk8ZH7iD_Y" frameborder="0" allowfullscreen></iframe>
    How to embed a Youtube video into a popup window - Javascript code
    • Insert URL into the javascript code as highligted below
    • Insert the width and height into the code as also highlighted below.


    <script type="text/javascript">

    // Popup window code
    function newPopup(url) {
    popupWindow = window.open(
    url,'popUpWindow','height=315,width=560,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no,status=yes')
    }
    </script>
    <p><a href="JavaScript:newPopup('https://www.youtube.com/embed/xPk8ZH7iD_Y');" title="">See embedded Youtube Video in a popup window</a></p>










    No comments:

    Post a Comment

    Note: Only a member of this blog may post a comment.