Вопросы Теги

Как удалить большой игровой фон на ионный видеоплейер? [Дубликат]

Я нашел эту страницу после выполнения некоторых упражнений с образцами и с тем же самым загадкой.

============== Я перешел от этого кода в качестве примера =============== 

public static void main(String[] args) throws IOException {

    Map wordMap = new HashMap();
    if (args.length > 0) {
        for (int i = 0; i < args.length; i++) {
            countWord(wordMap, args[i]);
        }
    } else {
        getWordFrequency(System.in, wordMap);
    }
    for (Iterator i = wordMap.entrySet().iterator(); i.hasNext();) {
        Map.Entry entry = (Map.Entry) i.next();
        System.out.println(entry.getKey() + " :\t" + entry.getValue());
    }

====================== Этот код ======================== 

public static void main(String[] args) throws IOException {
    // replace with TreeMap to get them sorted by name
    Map<String, Integer> wordMap = new HashMap<String, Integer>();
    if (args.length > 0) {
        for (int i = 0; i < args.length; i++) {
            countWord(wordMap, args[i]);
        }
    } else {
        getWordFrequency(System.in, wordMap);
    }
    for (Iterator<Entry<String, Integer>> i = wordMap.entrySet().iterator(); i.hasNext();) {
        Entry<String, Integer> entry =   i.next();
        System.out.println(entry.getKey() + " :\t" + entry.getValue());
    }

}

================ ================================================== =============

Это может быть безопаснее, но потребовалось 4 часа, чтобы одурачить философию ...

65
задан Hasib Hasan Arnab 6 February 2014 в 12:47
поделиться

5 ответов

Это похоже на дополнительное изображение, которое показано там.

Вы можете попробовать использовать этот 

<img src="/images/image_of_video.png" alt="image" />
/* write your code for the video here */

Теперь, используя jQuery, воспроизведите видео и спрячьте изображение как 

$('img').click(function () {
  $(this).hide();
  // use the parameters to play the video now..
})
125
ответ дан Afzaal Ahmad Zeeshan 22 August 2018 в 05:14
поделиться
  • 1
    Спасибо. Я не использовал jQuery для игры, но могу попробовать. Есть ли у вас хорошие предложения? – Ivijan Stefan Stipić 19 November 2013 в 18:51
  • 2
    Это лучшее предложение, используя это, вы можете автоматически скрывать изображение, которое там показывалось. И просто воспроизведите видео, используя $('video').play(); :) – Afzaal Ahmad Zeeshan 19 November 2013 в 18:55
  • 3
    Благодаря! Я попробую. – Ivijan Stefan Stipić 19 November 2013 в 19:34

Отобразите свой первый видеофрагмент в качестве миниатюры:

Добавьте preload="metadata" в свой видеотег и второй из первого кадра #t=0.5 к вашему источнику видео: 

<video width="400" controls="controls" preload="metadata">
  <source src="https://www.w3schools.com/html/mov_bbb.mp4#t=0.5" type="video/mp4">
</video>

28
ответ дан David Ben Dahan 22 August 2018 в 05:14
поделиться 
<?php
$thumbs_dir = 'E:/xampp/htdocs/uploads/thumbs/';
$videos = array();
if (isset($_POST["name"])) {
 if (!preg_match('/data:([^;]*);base64,(.*)/', $_POST['data'], $matches)) {
  die("error");
 }
 $data = $matches[2];
 $data = str_replace(' ', '+', $data);
 $data = base64_decode($data);
 $file = 'text.jpg';
 $dataname = file_put_contents($thumbs_dir . $file, $data);
}
?>
//jscode
<script type="text/javascript">
 var videos = <?= json_encode($videos); ?>;
 var video = document.getElementById('video');
 video.addEventListener('canplay', function () {
     this.currentTime = this.duration / 2;
 }, false);
 var seek = true;
 video.addEventListener('seeked', function () {
    if (seek) {
         getThumb();
    }
 }, false);

 function getThumb() {
     seek = false;
     var filename = video.src;
     var w = video.videoWidth;//video.videoWidth * scaleFactor;
     var h = video.videoHeight;//video.videoHeight * scaleFactor;
     var canvas = document.createElement('canvas');
     canvas.width = w;
     canvas.height = h;
     var ctx = canvas.getContext('2d');
     ctx.drawImage(video, 0, 0, w, h);
     var data = canvas.toDataURL("image/jpg");
     var xmlhttp = new XMLHttpRequest;
     xmlhttp.onreadystatechange = function () {
         if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
         }
     }
     xmlhttp.open("POST", location.href, true);
     xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
     xmlhttp.send('name=' + encodeURIComponent(filename) + '&data=' + data);
 }
  function failed(e) {
     // video playback failed - show a message saying why
     switch (e.target.error.code) {
         case e.target.error.MEDIA_ERR_ABORTED:
             console.log('You aborted the video playback.');
             break;
         case e.target.error.MEDIA_ERR_NETWORK:
             console.log('A network error caused the video download to fail part-way.');
             break;
         case e.target.error.MEDIA_ERR_DECODE:
             console.log('The video playback was aborted due to a corruption problem or because the video used features your browser did not support.');
              break;
          case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
              console.log('The video could not be loaded, either because the server or network failed or because the format is not supported.');
              break;
          default:
              console.log('An unknown error occurred.');
              break;
      }


  }
</script>
//Html
<div>
    <video   id="video" src="1499752288.mp4" autoplay="true"  onerror="failed(event)" controls="controls" preload="none"></video>
</div>
2
ответ дан debasish 22 August 2018 в 05:14
поделиться

Я нашел решение, которое получил из вашего примера и других примеров, и сделал следующее: 

<video id="video1" width="470" height="264"  poster="video_poster.jpg" onclick="playPause()">
                  <source src="video.mp4" width="470" height="264" type="video/mp4" >
                  <source src="video.webm" type="video/webm" >
                  <source src="video.ogv" type="video/ogg" >                      
                  <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="470" height="264" >
                  <param name="movie" value="video.swf" >
                  <param name="quality" value="high">
                  <param name="wmode" value="opaque">
                  <param name="swfversion" value="11.0.0.0">
                  <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
                  <param name="expressinstall" value="../../Scripts/expressInstall.swf">
                  <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
                  <!--[if !IE]>-->
                  <object type="application/x-shockwave-flash" data="video.swf" width="500" height="500">
                    <!--<![endif]-->
                    <param name="quality" value="high">
                    <param name="wmode" value="opaque">
                    <param name="swfversion" value="11.0.0.0">
                    <param name="expressinstall" value="../../Scripts/expressInstall.swf">
                    <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
                    <div>
                      <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                      <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
                    </div>
                    <!--[if !IE]>-->
                  </object>
                  <!--<![endif]-->
                    Unfortunately Your browser is old and does not support full video experience.
                </object>


                </video> 
                <script> 
                var myVideo=document.getElementById("video1"); 
                var att=document.createAttribute("poster");
                if (myVideo.error) {
                     switch (myVideo.error.code) {
                       case MEDIA_ERR_NETWORK:alert("Network error - please try again later.");break;
                       case MEDIA_ERR_DECODE:alert("Video is broken.."); break;
                       case MEDIA_ERR_SRC_NOT_SUPPORTED:alert("Sorry, your browser can't play this video."); break;
                     }
                }
                else
                {
                    function playPause()
                    { 
                        if (myVideo.paused) 
                        {
                          myVideo.play();
                          att.value="";
                          myVideo.setAttributeNode(att);
                        }
                        else myVideo.pause();
                    }
                }                       
                </script>

Фантастическая работа. Спасибо!

3
ответ дан Ivijan Stefan Stipić 22 August 2018 в 05:14
поделиться

Если вы хотите, чтобы видео первый кадр был миниатюрным, вы можете использовать 

Add #t=0.1 to your video source, like below

<video width="320" height="240" controls>
  <source src="video.mp4#t=0.1" type="video/mp4">
</video>

ПРИМЕЧАНИЕ: убедитесь, что ваш тип видео (например: mp4, ogg, webm и т. д.)

12
ответ дан PVCS 22 August 2018 в 05:14
поделиться
  • 1
    Отлично! Благодаря! – Ivijan Stefan Stipić 10 April 2017 в 06:15
  • 2
    Только если видео было предварительно загружено. В противном случае он по-прежнему будет показывать черный фон в IE до тех пор, пока видео не будет загружено браузером! – Hafenkranich 10 July 2017 в 07:39
Другие вопросы по тегам:

Похожие вопросы: