2016-07-20 2 views
0

私のサイトにhtmlビデオタグが追加され、再生一時停止を処理する必要があるため外部に再生ボタンが配置されました。すべてのデバイスで正常に動作しますが、我々はhttp://www.snoozeal.com/htmlビデオタグの携帯電話に大きな再生ボタンが表示されます

がスタックなどから多くのソリューションを試みたが、ここで

を動作しませんでしたiphoneのサファリで開くとiphoneを除き、大きな再生ボタンがある映像の中央に表示されます私は

video::-webkit-media-controls-fullscreen-button { 
display: none; 
} 
video::-webkit-media-controls-play-button { 
    background: red; 
} 
video::-webkit-media-controls-play-button {} 
video::-webkit-media-controls-timeline {} 
video::-webkit-media-controls-current-time-display{} 
video::-webkit-media-controls-time-remaining-display {} 
video::-webkit-media-controls-time-remaining-display {} 
video::-webkit-media-controls-mute-button {} 








video::-webkit-media-controls { 
    display:none !important; 
} 

.overlay-video video {pointer-events: none} 
.overlay-video video::-webkit-media-controls {display: none !important} 


*::-webkit-media-controls-panel { 
    display: none!important; 
    -webkit-appearance: none; 
} 

/* Old shadow dom for play button */ 

*::--webkit-media-controls-play-button { 
    display: none!important; 
-webkit-appearance: none; 
} 

/* New shadow dom for play button */ 

/* This one works */ 

*::-webkit-media-controls-start-playback-button { 
    display: none!important; 
    -webkit-appearance: none; 
} 
+0

上の再生ボタンを非表示にするにはこれをしようとしているあなたは、あなたのプレイボタンサイズの問題を解決したように見えます。参考までに、あなたのビデオのデフォルト画像のHTMLビデオポスター属性を調べてください。私のiPhoneでは、これは空白の白いボックスとして表示されます。 – stackingjasoncooper

+0

いいえいいえデスクトップ上でどのように動作しているかを確認してください。 iphoneでもデスクトップのようなアイコンを再生する必要があります –

+0

iPhoneで[ビデオポスター](http://www.w3schools.com/tags/att_video_poster.asp)が表示されません - 空白が表示されますビデオがある領域。あなたの白い再生ボタンは表示されません。それはそこにある(私はそれが 'style = display:none'を持っているのを見るが)。ビデオポスターを追加して、そのスタイルを離します。 – stackingjasoncooper

答えて

0

を試してみましたいくつかのCSSはiOSの

video::-webkit-media-controls{display: none !important;} 
関連する問題