Youtube within the frame

Memasang Kode Youtube within the frame
Login ke akun blog klik tombol blog baru, buat satubuah link baru   
kemudian beri nama sesuai fungsi,  klik Edit HTML pada link baru tersebut, 
hapus semua kode template ganti dengan kode blank template, yang tersedia pada sumber  berikut :  Get Blank Template.   edit background warna sesuai keinginan klik simpan selesai.

Kemudian klik entri halaman baru HTML pada link tersebut.
copy kode dibawah ini, pastekan kedalam halaman baru tersebut dan klik simpan selesai

<style class="M-2010-styles"> 
body {);color:red;height:100%;overflow:hidden;}
body { 
 background: -moz-linear-gradient(top, #111 0%, rgba(53,02,01,1) 100%);
  height: 100%;
  width: 100%;
}
header {
  -o-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  padding:  1px 0;
  position: fixed;
  top: 0;
  width: 100%;
text-align: center;
text-shadow: 0px 0px #fff;  
font-size:  6px;
background: -moz-linear-gradient(top, #333 0%, rgba(53,02,01,1) 100%);
  border-bottom: 3px solid #dad;  
}
.ap {
position: fixed;
right: 0;
bottom: 0;
left: 0;
height: 60px;
margin: auto;
font-family: Arial, sans-serif;
font-size: 10px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
text-align: center;
text-shadow: 0px 0px #FFf;  
font-size:  11px;
background:  #111;
border-top: 2px solid #f0f;
z-index: 9999;
} 
h2 {
padding: 15px; 
background: -webkit-linear-gradient(transparent 10%, goldenrod 50%, transparent 90%); 
background: linear-gradient(transparent 10%, #666 50%, transparent 90%); 
}

.app {
  position: relative;
  margin: 90px auto;
  width: 550px;
  height: 316px;
  overflow: hidden;
border: 20px solid transparent;
 -moz-border-image: -moz-linear-gradient(top, #660099 0%, #fc0 100%);
 -webkit-border-image: -webkit-linear-gradient(top, #660099 0%, #fc0 100%);
 border-image: linear-gradient(to bottom, #660099 0%, #fc0 100%);
 border-image-slice: 1;
 }
.begin-playing-active {
  background-position: left !important;
}
.begin-playing {
  z-index: 5;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #111;
  transition: all 0.3s;
}
</style>

<div class="app">
<div class="begin-playing">
<iframe width="550" height="315" src="https://www.youtube.com/embed/vO_kwR9CATE" frameborder="0" allowfullscreen></iframe>
</div>

<div class="ap" id="ap">
<div align="center">
<a href="https://Link Download"title="Myscript2010s"> 
<h2>
<span style="color:orange; font-size: 10pt">DOWNLOAD FULL CODE</2></a></span> 
</div>
<header>
<a href="http://sample-mys2010.blogspot.co.id/2016/06/youtube-within-frame.html" target="_blank" title="Mari Belajar">
<h2>
<span style="color:green; font-size: 10pt">LET'S STUDY</2></a> </span> 
</div>
</header>

<script src='//assets.codepen.io/assets/common/stopExecutionOnTimeout.js?t=1'>
</script>
<script src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'>
</script>
<script>var menu = $('.menu-button'), playlist = $('ul.playlist'), current = $('.now-playing');
menu.on('click', function () {
    $(this).toggleClass('menu-active');
    playlist.toggleClass('playlist-active');
    current.toggleClass('now-playing-active');
});
</script>

Design code is edited by. Myscript2010 

DEMOSHOW

If you want to directly copy  and  paste you canDownload Youtube within the frame  

Category: Youtube within the frame

Tweet