SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    Addicted to the Source of Life PowerBit's Avatar
    Join Date
    Feb 2004
    Location
    Loveland Co
    Posts
    548
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Transparent frame layered over embedded object. Object not viewing through frame.

    Hi there,

    I am working on a project that requires a screen "frame" graphic over the top of an embedded movie object. The graphic is a transparent .png stacked over the embedded object. The movie is a You Tube video. As you can see the video does not show through in the link provided.

    http://www.newmanexpressions.com//sa...videoTest.html

    Here is the html for the page passed in the I frame of the media viewer.

    HTML Code:
    <!DOCTYPE html PUBLIC
        "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
      <head>
        <meta http-equiv="content-type"
            content="text/html; charset=utf-8">
        <title>title</title>
    	<meta name="description" content="a description of your page"> 
    	<meta name="keywords" content="a, list, of, keywords"> 
        
    <style type="text/css">
    * {margin:0; padding:0;}
    #back {background: #fff;
    	width:761px;
    	height:354px;
    }
    
    #viewer {background:transparent url(viewPort.png) no-repeat; 
    	width:761px;
    	height:354px;
    	position:relative;
    }
    
    a img{border:0 none;}
    img.left {float:left; padding:155px 0 0 40px;}
    img.right {float:right; padding:155px 40px 0 0;}
    
    #soundCloud {padding:250px 0 0 80px;}
    
    #youTube {padding-left: 10px;}
    
    </style>
    
    	<link rel="stylesheet" type="text/css" href="../css2/template.css">
    	<link rel="stylesheet" type="text/css" href="../css2/mediaPlayers.css">
    	<script type="text/javascript">
    
    </script>
    
    <!-- shareThis -->
    <script type="text/javascript">var switchTo5x=true;</script>
    <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
    <script type="text/javascript">stLight.options({publisher: "ur-874391ac-8ab5-972-6a1a-245f29032bd9"}); </script>
    <!-- END shareThis -->
    
     </head>
    <body>
    <div id="viewer"></div>
    <object width="742" height="354" id="youTube"><param name="movie" value="http://www.youtube.com/v/ZDaDWQBA6Yc?version=3&amp;hl=en_US&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/ZDaDWQBA6Yc?version=3&amp;hl=en_US&amp;rel=0" type="application/x-shockwave-flash" width="742" height="354" allowscriptaccess="always" allowfullscreen="true"></embed></object>	
    <div id="back"></div>
    
    
    
    </body>
    </html>

  2. #2
    Addicted to the Source of Life PowerBit's Avatar
    Join Date
    Feb 2004
    Location
    Loveland Co
    Posts
    548
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What I am wondering is... How does a guy use a frame like this and stack it over a movie object with permitted transparency? Is there something I am missing about this process?


Bookmarks

Posting Permissions

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