এইচটিএমএল 5 ভিডিও // সম্পূর্ণরূপে নিয়ন্ত্রণগুলি লুকান

Question

আমি কীভাবে পুরোপুরি এইচটিএমএল 5 ভিডিও নিয়ন্ত্রণগুলি লুকিয়ে রাখতে পারি?

<video width="300" height="200" controls="false" autoplay="autoplay">
<source src="video/supercoolvideo.mp4" type="video/mp4" />
</video> 

মিথ্যা কাজ করেনি - এটি কিভাবে হয়?

চিয়ার্স

Answer 1

এটার মত:

<video width="300" height="200" autoplay="autoplay">
  <source src="video/supercoolvideo.mp4" type="video/mp4" />
</video>

controlsএকটি বুলিয়ান বৈশিষ্ট্য :

দ্রষ্টব্য: "সত্য" এবং "মিথ্যা" মানগুলি বুলিয়ান বৈশিষ্ট্যের ক্ষেত্রে অনুমোদিত নয়। একটি মিথ্যা মান উপস্থাপন করতে, বৈশিষ্ট্যটি পুরোপুরি বাদ দিতে হবে।

Comments

প্রযুক্তিগতভাবে এটি কাজ করে; এবং আমি অনুমান করি, এটিই উত্তর। যদিও; এইচটিএমএল 5 ভিডিও মার্ক-আপের মধ্যে 'নিয়ন্ত্রণ' সরিয়ে, আইপ্যাডে ভিডিওটিকে হত্যা করে; সুতরাং আমি অন্য একটি সমাধান প্রয়োজন।

— ফ্রেড র্যান্ডেল

@ 1977 এই প্রশ্নটি সম্ভবত প্রাসঙ্গিক

— রবার্টক

আপনি কন্ট্রোল বৈশিষ্ট্য সহ ট্যাগটি লোড করার চেষ্টা করতে পারেন এবং কিছু জাভাস্ক্রিপ্ট দিয়ে পৃষ্ঠা লোডের পরে এটি সরিয়ে ফেলতে পারেন: var ভিডিও = ডকুমেন্ট.জেটমেন্টমেন্টবাইআইডি ('মাইভিডিও'); video.control = মিথ্যা;

— ব্যবহারকারী 3072843

The values "true" and "false" are not allowed on boolean attributes। বিভ্রান্তিকর সম্পর্কে কথা বলতে।

— নটলিজার্ডস

@ জম্মিপিয়েচ বৈশিষ্ট্যগুলি বুলিয়ান কারণ তাদের দুটি রাষ্ট্র রয়েছে: তাদের উপস্থিতি আছে বা তারা নেই

— Robertc

Answer 2

আপনি ডেমোর মতো সিএসএস সিউডো সিলেক্টর ব্যবহার করে নিয়ন্ত্রণগুলি লুকিয়ে রাখতে পারেন: https://jsfiddle.net/g1rsasa3

//For Firefox we have to handle it in JavaScript 
var vids = $("video"); 
$.each(vids, function(){
       this.controls = false; 
}); 
//Loop though all Video tags and set Controls as false

$("video").click(function() {
  //console.log(this); 
  if (this.paused) {
    this.play();
  } else {
    this.pause();
  }
});

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

/* Could Use thise as well for Individual Controls */
video::-webkit-media-controls-play-button {}

video::-webkit-media-controls-volume-slider {}

video::-webkit-media-controls-mute-button {}

video::-webkit-media-controls-timeline {}

video::-webkit-media-controls-current-time-display {}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<!-- Hiding HTML5 Video Controls using CSS Pseudo selectors -->

<video width="800" autoplay controls="false">
  <source src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4">
</video>

Comments

এটি ক্রোমের পক্ষে দুর্দান্ত কাজ করে তবে ফায়ারফক্সের পক্ষে নয়। আপনার কি ক্রস-ব্রাউজার সমাধান রয়েছে?

— টিনিটাইগার

সেগুলি সিএসএস বা জাভাস্ক্রিপ্ট দিয়ে মুছে ফেলা দরকার কারণ আমি একসাথে কিছু হ্যাক করছি এবং সরাসরি ভিডিও ট্যাগ কোডটি সম্পাদনা করতে পারি না

— টিনিটাইগার

হেই মজিলার পক্ষে বেনি। আপনার সবার জন্য "-মোজ-মিডিয়া-কন্ট্রোলস-প্লে-বোতাম" এর মতো বিক্রেতার উপসর্গযুক্ত সিএসএস যুক্ত করা দরকার। ধন্যবাদ

— AbidCharlotte49er

উপসর্গগুলি যুক্ত করার চেষ্টা করা হয়েছিল কিন্তু এটি কার্যকর হয়নি। এখানে একটি আপডেট করা জেএসফিডাল এবং এখানে আমি ব্যবহৃত সিএসএসvideo::-webkit-media-controls, video::-moz-media-controls, video::-o-media-controls, video::-ms-media-controls { display: none !important; }

— টিনিটাইগার

এইগুলি থেকে পৃথক নিয়ন্ত্রণগুলির কোনও গতিশীলভাবে প্রদর্শন / আড়াল করা কি সম্ভব? উদাহরণস্বরূপ: সিএসএস ভিডিও প্রয়োগ করুন :: - ওয়েবকিট-মিডিয়া-কন্ট্রোলস-বর্তমান-সময়-প্রদর্শন none প্রদর্শন: কিছুই নয়;} প্রাথমিকভাবে বর্তমান সময়ের নিয়ন্ত্রণটি গোপন করতে তবে যখন ভিডিওটি চালানো হয়, তখন সিএসএস ক্লাস আপডেট করে বর্তমান সময়ের নিয়ন্ত্রণটি প্রদর্শন করুন ভিডিও :: - ওয়েবকিট-মিডিয়া-নিয়ন্ত্রণ-বর্তমান-সময়-প্রদর্শন {/ * প্রদর্শন: কিছুই নয়; * /}} অথবা একটি ভিন্ন সিএসএস ক্লাস প্রয়োগ করুন যা বর্তমান সময়টি দেখায়। ধন্যবাদ

— user4848830

Answer 3

একটি সহজ সমাধান হ'ল - কেবল ব্যবহারকারীর ইন্টারঅ্যাকশন উপেক্ষা করার জন্য :-)

video {
  pointer-events: none;
}

Comments

নিয়ন্ত্রণগুলি প্রাথমিক লোডে প্রদর্শিত হয় ব্যতীত এটি কাজ করে।

— m4n0

Answer 4

প্রথমত, ভিডিওর "নিয়ন্ত্রণ" বৈশিষ্ট্যটি সরান।
আইওএসের জন্য, আমরা নিম্নলিখিত সিএসএস সিউডো নির্বাচক যুক্ত করে ভিডিওর বিল্টিন প্লে বোতামটি আড়াল করতে পারি:

video::-webkit-media-controls-start-playback-button {
    display: none;
}

Answer 5

এই পদ্ধতিটি আমার ক্ষেত্রে কাজ করেছিল।

video=getElementsByTagName('video');
function removeControls(video){
  video.removeAttribute('controls');
}
window.onload=removeControls(video);

Answer 6

<video width="320" height="240" autoplay="autoplay">
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

Comments

আমি রাজী. সবচেয়ে সহজ সমাধানটি হ'ল গুণটি আরম্ভ করা উচিত নয়।

— PRMan

Answer 7

document.addEventListener("DOMContentLoaded", function() { initialiseMediaPlayer(); }, false);


function initialiseMediaPlayer() {

    mediaPlayer = document.getElementById('media-video');

    mediaPlayer.controls = false;

    mediaPlayer.addEventListener('volumechange', function(e) { 
        // Update the button to be mute/unmute
        if (mediaPlayer.muted) changeButtonType(muteBtn, 'unmute');
        else changeButtonType(muteBtn, 'mute');
    }, false);  
    mediaPlayer.addEventListener('ended', function() { this.pause(); }, false); 
}

Comments

<! - সম্পূর্ণ পাঠ্য থেকে তৈরি করুন <স্ক্রিপ্ট src = 'মিডিয়া-প্লেয়ার.js'> </script> এবং একই ডিরেক্টরিতে রাখুন ->

— ব্যবহারকারী 6884687