Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    jzo
    jzo is offline
    New Coder
    Join Date
    Oct 2011
    Location
    Boston
    Posts
    72
    Thanks
    4
    Thanked 5 Times in 5 Posts

    cant get the page to load unexpanded

    so when the page is initially opened, i dont want the video to be showing until the preview button is clicked.
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Christmas Greets!</title>
    <script type="text/javascript">
    <!--
    function switchMenu(obj) {
    	var el = document.getElementById(obj);
    	if ( el.style.display != "none" ) {
    		el.style.display = 'none';
    	}
    	else {
    		el.style.display = '';
    	}
    }
    //-->
    </script>
    </head>
    
    <body>
    <div id="wrapper">
    <img src="somepicture.png"
    	<p><a onclick="switchMenu('myvar');" title="View Greeting"><button>Preview</button></a></p>
    	<div id="myvar">
    	<video width="240" height="160" controls="controls">
      	<source src="EatResponsibly.mp4" type="video/mp4" />
      	<source src="EatResponsibly.ogv" type="video/ogv" />
      	<source src="EatResponsibly.webm" type="video/webm" />
      	You Browser Does not Support This Video.
     	Please Update Your Browser.
    	</video>
    </div>
    </div>
    </body>
    </html>

  • #2
    jzo
    jzo is offline
    New Coder
    Join Date
    Oct 2011
    Location
    Boston
    Posts
    72
    Thanks
    4
    Thanked 5 Times in 5 Posts
    any ideas? im not a great javascript programmer, im better at php haha

  • #3
    Senior Coder chump2877's Avatar
    Join Date
    Dec 2004
    Location
    the U.S. of freakin' A.
    Posts
    2,778
    Thanks
    19
    Thanked 155 Times in 146 Posts
    Something like this (I did not test this):

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Christmas Greets!</title>
    <script type="text/javascript">
    	function toggleContent(id) 
    	{
    		var el = document.getElementById(id);
    		el.style.display = (el.style.display == "block") ? "none" : "block";
    	}
    </script>
    </head>
    
    <body>
    <div id="wrapper">
    <img src="somepicture.png"
    	<p><input type="button" value="Preview" onclick="toggleContent('myvar')" /></p>
    	<div id="myvar" style="display:none">
    	<video width="240" height="160" controls="controls">
      	<source src="EatResponsibly.mp4" type="video/mp4" />
      	<source src="EatResponsibly.ogv" type="video/ogv" />
      	<source src="EatResponsibly.webm" type="video/webm" />
      	You Browser Does not Support This Video.
     	Please Update Your Browser.
    	</video>
    </div>
    </div>
    </body>
    </html>
    Regards, R.J.

    ---------------------------------------------------------

    Help spread the word! Like my YouTube-to-Mp3 Conversion Script on Facebook !! :)
    [Related videos and tutorials are also available at my YouTube channel and on Dailymotion]
    Get free updates about new software version releases, features, and bug fixes!

  • #4
    jzo
    jzo is offline
    New Coder
    Join Date
    Oct 2011
    Location
    Boston
    Posts
    72
    Thanks
    4
    Thanked 5 Times in 5 Posts
    Great ! Slapblyself.in the for head for that one..overthinking


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •