Html Yayın İçine Logo Ekleme

  • Konuyu başlatan Konuyu başlatan yunusevo
  • Başlangıç tarihi Başlangıç tarihi
Y

yunusevo

Öğrenci
Katılım
14 Ağustos 2020
Mesajlar
4
Reaksiyon puanı
0
Puanları
1
Merhabalar
<link rel="stylesheet" href="http://releases.flowplayer.org/7.0.2/skin/skin.css">
<style>.flowplayer {background-color: #00abcd;}
.flowplayer .fp-color-play {fill: #eee;}
</style>
<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="http://releases.flowplayer.org/7.0.2/flowplayer.min.js"></script>
<script src="http://releases.flowplayer.org/hlsjs/flowplayer.hlsjs.min.js"></script>
<div data-live="true" data-ratio="0.5625" class="flowplayer">
<video data-title="Live stream">
<source type="application/x-mpegurl"
src="https://tv-trt1.live.trt.com.tr/master_720.m3u8">
</video>
</div>

Elimde böyle bir kod var

Kodu çalıştırdığımda böyle bir ekran geliyo :
burXnP.png


Ben buna logo eklemek istiyorum nasıl yapabilirim.

örn :
viwzMj.png
 
C

chnkyn

Öğrenci
Katılım
11 Ocak 2018
Mesajlar
85
Reaksiyon puanı
14
Puanları
8
Yaş
33
Konum
Diyarbakır
böyle bir şey denemedim ama, videonun o kısmını silip yerine kendi logonu yerleştirmek istiyorsan, video düzenleme programları ile yapabilirsin (camtasia gibi)

yok video oynarken üstüne kendi logomu ekleyeceğim dersen de,
video containerına position:relative
ve
logona => position:absolute verdikten sonra
logonun top ve left/right değerleriyle oynayarak üstüne denk getirene kadar değiştirebilirsin.
örn =>
top:100px;
right:50px;

üstten 100 ve sağdan da 50 px içeri girer.
 
Y

yunusevo

Öğrenci
Katılım
14 Ağustos 2020
Mesajlar
4
Reaksiyon puanı
0
Puanları
1
chnkyn dedi ki:
böyle bir şey denemedim ama, videonun o kısmını silip yerine kendi logonu yerleştirmek istiyorsan, video düzenleme programları ile yapabilirsin (camtasia gibi)

yok video oynarken üstüne kendi logomu ekleyeceğim dersen de,
video containerına position:relative
ve
logona => position:absolute verdikten sonra
logonun top ve left/right değerleriyle oynayarak üstüne denk getirene kadar değiştirebilirsin.
örn =>
top:100px;
right:50px;

üstten 100 ve sağdan da 50 px içeri girer.
Genişletmek için tıkla ...
Usta bu canlı yayın mesela selcuksportsu falan biliyosundur yayının üstünde kendi logosu var bende o tarz bişey yapmak istiyorum eğer biliyorsan benim attığım html ile oynayıp tekrar atabilir misin?
 
Asuna-san

Asuna-san

Öğrenci
Katılım
10 Eylül 2020
Mesajlar
36
Reaksiyon puanı
15
Puanları
8
Yaş
24
Konum
İstanbul
Kod: 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="http://releases.flowplayer.org/7.0.2/skin/skin.css">
    <style>
            .flowplayer 
            {
                background-color: #00abcd;
            }
            .flowplayer .fp-color-play 
            {
                fill: #eee;
            }
            .flowplayer{
                width: 1000px;
            }
            .site-name{
                position: absolute;
                right: 400px;
                top: 100px;
                z-index: 999;
                font-size: 25px;
                font-weight: bold;
                background: blue;
                border-radius: 5px;
                color:#FFFFFF;
           }
        </style>
        <script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
        <script src="http://releases.flowplayer.org/7.0.2/flowplayer.min.js"></script>
        <script src="http://releases.flowplayer.org/hlsjs/flowplayer.hlsjs.min.js"></script>
</head>
<body>
<div data-live="true" data-ratio="0.5625" class="flowplayer">
<video data-title="Live stream">
<source type="application/x-mpegurl"
src="https://tv-trt1.live.trt.com.tr/master_720.m3u8">
</video>
</div>
<div class="site-name"><!-- BU KISMA LOGODA KOYABİLİRSİNİZ ---> yunusevoTV</div>
    
</div>
</body>
</html>

Hocam top right left komutlarından pozisyonunu kendiniz ayarlayabilirsiniz önerim yazı yerine <img src="dosyayolu"> Logo koymanız.
 
Asuna-san

Asuna-san

Öğrenci
Katılım
10 Eylül 2020
Mesajlar
36
Reaksiyon puanı
15
Puanları
8
Yaş
24
Konum
İstanbul
Hocam, fakat ekranı full screen yaptığında kaybolur, işinizi görmeyebilir.
 
Samet UCA

Samet UCA

Müdavim
Müdavim
Katılım
3 Ağustos 2012
Mesajlar
3,287
Reaksiyon puanı
2,930
Puanları
358
İyide bu htmlli bir durum değil ki. Canlı yayın yapacağın program o an canlı olarak paylaşılan ekranda çizim-logo ekleme-renk ayarları gibi seçeneklere izin verir. Zaten canlı yayınları takip edersen adamlar logoları mouse ile sürükleyip oraya bırakıyor.
 
Son düzenleme:
Y

yunusevo

Öğrenci
Katılım
14 Ağustos 2020
Mesajlar
4
Reaksiyon puanı
0
Puanları
1
Samet UCA dedi ki:
İyide bu htmlli bir durum değil ki. Canlı yayın yapacağın program o an canlı olarak paylaşılan ekranda çizim-logo ekleme-renk ayarları gibi seçeneklere izin verir. Zaten canlı yayınları takip edersen adamlar logoları mouse ile sürükleyip oraya bırakıyor.
Genişletmek için tıkla ...
twitch gibi değil hocam şu şekilde bir örnek veriyim
www.taraftar3.xyz

ch5

Takip Et @taraftarium24kk Betist - Her yatırımda %33 Bonus + %10 Freespin Yayını Google Chrome ile açmanızı tavsiye ...
www.taraftar3.xyz www.taraftar3.xyz
siteye bakarsan sol üstte twitter işareti logolar reklamlar falan var html ile yapmış bunları ve tam ekran yapınca da gitmiyor bende bu şekilde bir şey sormuştum
Mesaj otomatik birleştirildi:

tam ekran yaptığımızda sağ üstte telegram adresi logosu görüyoruzya mesela bende o şekilde bir şey arıyorum
 
Cevap yazmak için kayıt ol veya giriş yap

Benzer konular

M
Php Path Verme
Cevaplar
0
Görüntüleme
1K
mali2012
M
M
Slider Yapma Problemi
Cevaplar
1
Görüntüleme
2K
enesyuksel
enesyuksel
M
Css'de Dropdown Menü'de Genişlik Sorunu
Cevaplar
2
Görüntüleme
1K
mali2012
M
L
Yardım Login sayfasında kayıt olamama ve giriş yapamama sorunu
Cevaplar
0
Görüntüleme
1K
laikalpr
L
by_okitay
İletişim Formunu Mail Olarak Alma (PHP)
Cevaplar
1
Görüntüleme
1K
DYREX
DYREX

SDN Haberleri

Son mesajlar

Üst