Mouse ile üzerine gelindiğinde oynatılan YouTube embed kodu

YouTube embed kodu

Bazı büyük sitelerde özellikle reklam eklentilerinde sık sık kullanırlar bu özelliği. Mouse (fare) ile üzerine gelindiğinde video oynatılır ya da ses açılır, imleç farklı bir alana çekildiğinde ise oynatmayı ya da sesi durdurur.

Bu kod sayesinde ise blogumuza ya da web sitelerimize eklediğimiz YouTube videolarında, mouse ile üzerine gelindiğinde video oynatılıyor, üzerinden çekildiğinde ise oynatmayı durduruyor.

<!-- YouTube js mouse hover play code by @blogtecrubem -->
<script>var playersrc;</script>
<iframe class="yt560x315" id="JSytplayer" width="560" height="315"src="https://www.youtube.com/embed/rshTqpIoGto?rel=0;start=23" onmouseover="this.src=playersrc+'&autoplay=1'" onmouseout="this.src=playersrc" frameborder="0" allowfullscreen></iframe>
<script>playersrc=document.getElementById('JSytplayer').src;</script>

Gereken kod bu dostlarım. Bu kod ile blogunuza ya da web sitelerinize YouTube videoları ekleyebilir ve yukarıda bahsettiğim mouse hover yani üzerine gelindiğinde oynatma özelliğini katabilirsiniz. Bu kodları eklenti olarak ekleyin sitenize.

Peki bunu nasıl blogumuza ya da web sitelerimize ekleyebiliriz?

İşlemler yine çok basit. YouTube'dan eklemek istediğimiz videoyu buluyoruz. Daha sonra videonun linkinde

son kısımda yer alan ve yukarıdaki görselde belirttiğim yeri kopyalayıp kodlar arasında kırmızı renkle gösterdiğim kısımla değiştiriyorsunuz. Ardından bu kodu blogunuza ya da web sitenize eklenti olarak ekliyorsunuz. Tabi yayınların arasına da ekleyebilirsiniz, tabi HTML kısmına. Bu arada yeşil renkle belirttiklerimde videonun genişlik ve uzunluk değerleri. Bu değerleri de eklemek istediğiniz alana göre düzenleyebilirsiniz. Ayrıca mavi renkle belirttiğim start kodu da videonun kaçıncı saniyesinde başlayacağını belirten kod. Bunu da düzenlemeyi unutmayın.

Örnek olarak ta aşağıdaki videoyu ekledim.

Konuyla ilgili takıldığınız yerler olursa yorum yaparak bana bildirebilirsiniz.