Sedikit Info Seputar
How to Add a Turn Off Lights Effect in Blogger While Watching Videos
Terbaru 2017
- Hay gaes kali ini team Free Template BLogspot.Com, kali ini akan membahas artikel dengan judul How to Add a Turn Off Lights Effect in Blogger While Watching Videos, kami selaku Team Free Template BLogspot.Com telah mempersiapkan artikel ini untuk sobat sobat yang menyukai Free Template BLogspot.Com. semoga isi postingan tentang
Artikel Blogger Tips,
Artikel How to, yang saya posting kali ini dapat dipahami dengan mudah serta memberi manfa'at bagi kalian semua, walaupun tidak sempurna setidaknya artikel kami memberi sedikit informasi kepada kalian semua. ok langsung simak aja sob
Judul:
Berbagi Info Seputar
How to Add a Turn Off Lights Effect in Blogger While Watching Videos
Terbaru
link: How to Add a Turn Off Lights Effect in Blogger While Watching Videos
Berbagi How to Add a Turn Off Lights Effect in Blogger While Watching Videos Terbaru dan Terlengkap 2017

- Press Ctrl + F and search the </head> tag
Paste below code before </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
$("#lightoff").css("height", $(document).height()).hide();
$(".lightSwitcher").click(function(){
$("#lightoff").toggle();
if ($("#lightoff").is(":hidden"))
$(this).html("Turn off the lights").removeClass("turnedOff");
else
$(this).html("Turn on the lights").addClass("turnedOff");
});
});
//]]>
</script>
Now Search for this code ]]></b:skin>
/*--------Make Turn off the lights- ---------------------- */
#lightsVideo {
position:relative;
z-index:102;
}
#switch {
max-width:640px;
text-align:left;
position:relative;
height:25px;
display:block;
margin: 25px 0 0 60px;
}
.lightSwitcher {
position:absolute;
z-index:101;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdQ2_lUi6elKFAVvHQVAkXAs1-Bvkw1pNtV6sXnPOcDDaj9gD2KiG499vwZ90nsJOx0h4n35ZxB5cJ3neUQFozdJJR_dBe6xY-6TVcKiarfXKlrCuPmaaadMWpApX-0O9cxVvCw-vzHuHJ/s1600/wglightn.png);
background-repeat:no-repeat;
background-position:left;
padding: 0 0 0 20px;
outline:none;
text-decoration:none;
}
.lightSwitcher:hover {text-decoration:underline;}
.turnedOff {
color:#ffff00 !important;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEkw52y69a6btP-h6mwR_RcqMxoP5FOdwesPFF1Lc5IJmFXcFYpqaHLt8VT8dqlRi1MI911TjTpP08dZdpzBe8hdR-8hwuhIdHdl0hPHQAVYQerGllFtwqqfgkTJy3PDA97ABarDaj3e2i/s1600/wglightnf.png);
}
#lightoff {
background:#000;
opacity:0.8;
filter:alpha(opacity=80);
position:absolute;
left:0;
top:0;
width:100%;
z-index:100;
}
<center>
<div id="switch"><a class="lightSwitcher" href="javascript:void(0);">Turn off the lights</a></div>
<div id="lightsVideo">
paste here video code
</div>
</center>