Hızlı Konu Açma

Hızlı Konu Açmak için tıklayınız.

Son Mesajlar

Konulardaki Son Mesajlar

Reklam

Forumda Reklam Vermek İçin Bize Ulaşın

Web Site Arkaplanın da Video Nasıl Oynatmak

Darkwins

Fahri Üye
Fahri Üye
Katılım
9 Mayıs 2014
Mesajlar
94
Tepkime puanı
0
Puanları
0
Konum
Antalya
Merhaba Arkadaşlar,

Size bu sıralar pek çok sitede kullanılan bir çalışmadan bahsedeceğim. Bazı sitelerde web sayfaların arka planında ekranı kaplayan videolar bulunmakta ve bunun üzerinde ise site inşaa edilmektedir. Yani arka planda video oynatılırken sitenin diğer materyalleri ( butonlar, resimler, yazılar vs.) bu videonun üzerinde bulunmaktadır. İşte bugün bu konudan sizlere bahsedeceğim. İnşallah beğenirsiniz. (Bigvideo.js ile çalışan arkaplan video işlemi)

Size kendi yapmış olduğum çalışmanın indirme linkini vereceğim, çünkü çalışan dosyanın sizde örnek olarak durmasında yarar var. Ona bakarak kendi web sitenizin arka planına video koyabilirsiniz. Ama bazı şeyleri de burada anlatarak sizlere yol göstermek istiyorum. Dikkatlice okursanız hiçbir sorun olmayacaktır.

Örneğin İncelenmesi

Aşağıdaki kodlar <head> ile </head> Arasında olmalıdır.

Kod:
<link rel="stylesheet" href="css/style.css"><link rel="stylesheet" href="css/bigvideo.css">
<script src="js/modernizr-2.5.3.min.js">
<body> ve </body> arasında yer vereceğiniz şeyler tamamen videonun üzerinde olacağından istediğiniz gibi sitenizi yapabilirsiniz. Kısacası burada video ile ilgili hiçbir şey yoktur. Sadece sitenizi divlerle veya tablolarla oluşturdurktan sonra onların en altına aşağıdaki kodları yerleştirmeniz gerekmektedir.


Kod:
<!-- BigVideo ile çalışan scriptler --><script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>window.jQuery || document.write("<script src="js/jquery-1.7.2.min.js"></script>")</script>
<script src="js/jquery-ui-1.8.22.custom.min.js"></script>
<script src="js/jquery.imagesloaded.min.js"></script>
<script src="http://vjs.zencdn.net/c/video.js"></script>


<!-- BigVideo scripti -->
<script src="js/bigvideo.js"></script>


<!-- Video özellikleri -->
<script>
$(function() {
var BV = new $.BigVideo();
BV.init();
if (Modernizr.touch) {
BV.show("img/background-dock.jpg");
} else {
BV.show("vids/dock.mp4",{ambient:true});
}
});
</script>
Yukarıdaki kırmızı yazıyla yazılmış kısımdaki yer vids klasörünün içindeki videonun adıdır. Kendi videonuzu Bu kısma uzantısıyla birlikte koymanız gerekmektedir. Sonrasında web sitenizin arka planında vids klasörünün içinde olan video arka planda oynatılacaktır.

Bu çalışmayla birlikte artık web sitenizin arkasında videolarınızı istediğiniz gibi oynatabileceksiniz.

Kolay gelsin. Sorularınız olduğuna yorum kısmında bana ulaşabilirsiniz.

Linkleri sadece kayıtlı üyeler görebilir. Linkleri görebilmek için Üye Girişi yapın veya ücretsiz olarak Kayıt Olun




Alıntıdır
 

Users Who Are Viewing This Konu (Users: 0, Guests: 1)

Üst