サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
●はてなブックマークって？
●アプリ・拡張の紹介
●ユーザー登録
●ログイン
●ログアウト
ko-ya-ma
id:ko-ya-ma
●
19,511
ブックマーク
●
-
お気に入り
●
-
お気に入られ
タグ
●すべて
●
jQuery
(17)
●
2ch
(38)
●
3d
(74)
●
Ansible
(38)
●
Bluetooth
(20)
●
CMS
(25)
●
China
(64)
●
CodeIgniter
(16)
●
CreativeCommons
(21)
●
DDD
(28)
●
DOM
(21)
●
DeNA
(27)
●
IoT
(23)
●
Jenkins
(22)
●
LINE
(62)
●
MIT
(20)
●
Moon Gift
(15)
●
OpenSource
(121)
●
SEO
(245)
●
Safari
(38)
●
SocialBiz
(19)
●
TypeScript
(219)
●
WebDesign
(231)
●
Yahoo!
(49)
●
ad(380)
●
adblock
(20)
●
adobe
(30)
●
affiliate
(46)
●
agile
(62)
●
ai(272)
●
ajax
(112)
●
algorithm
(58)
●
amazon
(107)
●
analysis
(93)
●
analytics
(59)
●
android
(352)
●
animal
(28)
●
animation
(118)
●
anime
(102)
●
apache
(39)
●
api
(291)
●
app
(889)
●
apple
(122)
●
ar(59)
●
architecture
(149)
●
art
(135)
●
async
(21)
●
atom
(27)
●
auth
(53)
●
avatar
(16)
●
aws
(357)
●
backup
(29)
●
bash
(34)
●
basic
(682)
●
beacon
(16)
●
beta
(69)
●
bicycle
(32)
●
bio
(15)
●
bitcoin
(41)
●
biz
(1022)
●
blockchain
(52)
●
blog
(190)
●
book
(254)
●
bootstrap
(15)
●
bot
(57)
●
browser
(215)
●
button
(16)
●
buzz
(42)
●
cache
(36)
●
cafe
(24)
●
calendar
(29)
●
camera
(20)
●
canvas
(24)
●
car
(22)
●
cdn
(57)
●
centos
(16)
●
cgm
(41)
●
chart
(46)
●
chat
(98)
●
cheatsheet
(36)
●
child
(39)
●
chrome
(168)
●
ci(71)
●
cli
(40)
●
cloud
(171)
●
code
(289)
●
collaboration
(59)
●
color
(44)
●
comic
(208)
●
command
(52)
●
commercial
(42)
●
communication
(201)
●
community
(150)
●
company
(30)
●
compare
(47)
●
config
(56)
●
container
(86)
●
converter
(22)
●
cookie
(67)
●
cooking
(46)
●
cookpad
(29)
●
copyright
(57)
●
coupon
(20)
●
covid-19
(36)
●
crawler
(25)
●
crime
(72)
●
cron
(18)
●
css
(498)
●
css3
(96)
●
csv
(21)
●
culture
(107)
●
customize
(50)
●
data
(147)
●
db(312)
●
death
(39)
●
debug
(49)
●
deeplearning
(37)
●
demo
(22)
●
deno
(25)
●
deploy
(40)
●
design
(450)
●
desktop
(18)
●
dev
(5914)
●
devops
(125)
●
dns
(49)
●
docker
(270)
●
document
(53)
●
domain
(32)
●
donation
(30)
●
download
(133)
●
draw
(19)
●
dropbox
(24)
●
ebook
(64)
●
ec(183)
●
ec2
(19)
●
eclipse
(19)
●
economy
(31)
●
edit
(36)
●
editor
(107)
●
education
(123)
●
election
(20)
●
electron
(18)
●
element
(30)
●
english
(143)
●
error
(21)
●
es6
(17)
●
event
(41)
●
evernote
(17)
●
excel
(39)
●
extension
(135)
●
face
(18)
●
facebook
(198)
●
family
(20)
●
fashion
(39)
●
feed
(18)
●
figure
(21)
●
file
(60)
●
finance
(71)
●
firebase
(26)
●
firefox
(92)
●
flash
(74)
●
flow
(16)
●
fluentd
(18)
●
flux
(21)
●
font
(126)
●
food
(167)
●
form
(43)
●
framework
(214)
●
free
(399)
●
freesoft
(89)
●
frontend
(68)
●
fuelphp
(28)
●
future
(46)
●
gadget
(349)
●
game
(562)
●
gcp
(17)
●
generator
(56)
●
git
(99)
●
github
(90)
●
gmail
(19)
●
golang
(244)
●
google
(446)
●
gourmet
(38)
●
gov
(72)
●
gps
(69)
●
graph
(75)
●
graphql
(85)
●
grid
(18)
●
grpc
(27)
●
gui
(22)
●
guide
(44)
●
guideline
(70)
●
hack
(152)
●
handson
(70)
●
hatena
(25)
●
health
(159)
●
heroku
(17)
●
history
(193)
●
html
(184)
●
html5
(152)
●
http
(23)
●
icon
(72)
●
ide
(30)
●
idea
(847)
●
ie(49)
●
illustrator
(18)
●
image
(316)
●
insect
(16)
●
install
(69)
●
interview
(150)
●
ios
(472)
●
ip(28)
●
ipad
(59)
●
iphone
(392)
●
it(36)
●
jQueryMobile
(18)
●
japan
(140)
●
japanese
(112)
●
java
(133)
●
javascript
(1594)
●
job
(20)
●
joke
(62)
●
jquery
(250)
●
json
(57)
●
kayac
(15)
●
keyboard
(28)
●
kubernetes
(88)
●
lambda
(57)
●
language
(69)
●
law
(110)
●
layout
(76)
●
learning
(168)
●
lib
(113)
●
library
(285)
●
life
(426)
●
lifehack
(110)
●
lifehacks
(36)
●
links
(22)
●
lint
(15)
●
linux
(212)
●
list
(58)
●
literature
(26)
●
llm
(33)
●
local
(16)
●
log
(61)
●
logo
(19)
●
mac
(428)
●
machinelearning
(31)
●
mail
(74)
●
management
(272)
●
manual
(32)
●
map
(123)
●
markdown
(56)
●
marketing
(485)
●
mashup
(32)
●
matching
(17)
●
material
(28)
●
math
(97)
●
media
(132)
●
medical
(48)
●
mental
(19)
●
mercurial
(39)
●
method
(190)
●
microcredit
(18)
●
microservices
(66)
●
microsoft
(70)
●
mindmap
(18)
●
mixi
(40)
●
mobile
(206)
●
mockup
(38)
●
money
(86)
●
mongodb
(24)
●
monitoring
(44)
●
movie
(107)
●
music
(157)
●
mysql
(178)
●
nature
(59)
●
network
(71)
●
news
(260)
●
next.js
(28)
●
nft
(27)
●
nginx
(35)
●
nintendo
(52)
●
node.js
(188)
●
npm
(51)
●
npo
(24)
●
o2o
(26)
●
oculus
(33)
●
office
(58)
●
official
(32)
●
oop
(26)
●
os(33)
●
osx
(233)
●
p2p
(23)
●
patent
(17)
●
pattern
(61)
●
payment
(147)
●
pc(32)
●
pdf
(105)
●
performance
(239)
●
perl
(18)
●
person
(23)
●
photo
(172)
●
photoshop
(42)
●
php
(458)
●
plugin
(76)
●
politics
(83)
●
portal
(32)
●
postgresql
(28)
●
poverty
(36)
●
powerpoint
(23)
●
pr(34)
●
presentation
(102)
●
privacy
(132)
●
programming
(44)
●
project
(29)
●
promotion
(174)
●
proxy
(34)
●
psychology
(30)
●
pwa
(27)
●
python
(110)
●
qa(26)
●
rails
(35)
●
ranking
(40)
●
react
(23)
●
react.js
(217)
●
recipe
(37)
●
recruiting
(34)
●
redis
(21)
●
redmine
(30)
●
reference
(45)
●
report
(144)
●
research
(37)
●
responsive
(46)
●
review
(149)
●
robot
(32)
●
rss
(32)
●
ruby
(110)
●
rule
(21)
●
rust
(61)
●
sample
(274)
●
sass
(17)
●
science
(206)
●
scraping
(21)
●
scroll
(46)
●
scrum
(15)
●
sdk
(28)
●
search
(230)
●
security
(730)
●
selenium
(20)
●
sem
(18)
●
senior
(42)
●
server
(401)
●
serverless
(35)
●
share
(181)
●
shell
(44)
●
shibuya
(19)
●
shop
(66)
●
slack
(40)
●
smartphone
(172)
●
sns
(151)
●
social
(200)
●
society
(41)
●
software
(45)
●
sound
(63)
●
spam
(34)
●
sports
(17)
●
sql
(83)
●
ssh
(43)
●
ssl
(39)
●
startup
(173)
●
statistics
(80)
●
storage
(50)
●
story
(44)
●
study
(52)
●
svg
(28)
●
svn
(22)
●
table
(20)
●
tablet
(16)
●
task
(40)
●
tax
(20)
●
tdd
(26)
●
team
(151)
●
tech
(201)
●
telephone
(16)
●
template
(111)
●
terminal
(50)
●
test
(379)
●
tips
(2428)
●
todo
(50)
●
togetter
(68)
●
tokyo
(105)
●
tool
(695)
●
toy
(43)
●
tracking
(16)
●
travel
(17)
●
trend
(213)
●
trouble
(264)
●
tutorial
(602)
●
tv(28)
●
twitter
(270)
●
ui(466)
●
unity
(16)
●
ux(93)
●
vagrant
(31)
●
validation
(19)
●
vector
(43)
●
venture
(22)
●
video
(199)
●
vim
(33)
●
vm(42)
●
voice
(18)
●
vpn
(15)
●
vps
(15)
●
vr(115)
●
vscode
(32)
●
vue.js
(78)
●
wasm
(29)
●
web
(616)
●
web2.0
(125)
●
webpack
(43)
●
webservice
(1500)
●
webデザイン
(157)
●
web制作
(564)
●
web開発
(17)
●
wi-fi
(25)
●
wiki
(49)
●
windows
(303)
●
wish
(89)
●
word
(29)
●
wordpress
(52)
●
world
(105)
●
xss
(23)
●
youtube
(46)
●
あとで
(18)
●
これはすごい
(45)
●
はてな
(15)
●
まとめ
(934)
●
まとめサイト
(24)
●
アクセス解析
(28)
●
アフィリエイト
(23)
●
オープンソース
(59)
●
ガジェット
(52)
●
グループウェア
(15)
●
ケータイ
(47)
●
ゲーム
(20)
●
セキュリティ
(27)
●
ソフトウェア
(70)
●
ダウンロード
(20)
●
テンプレート
(22)
●
デザイン
(42)
●
ドメイン
(15)
●
ニュース
(29)
●
ネタ
(601)
●
ブログ
(55)
●
プログラミング
(46)
●
ポータル
(22)
●
ライブラリ
(43)
●
仕事
(43)
●
便利
(59)
●
共有
(24)
●
写真
(48)
●
動画
(54)
●
動画共有
(15)
●
動画配信
(16)
●
口コミ
(26)
●
地図
(21)
●
広告
(36)
●
情報
(28)
●
新聞
(16)
●
本
(24)
●
検索
(87)
●
検索エンジン
(29)
●
比較
(29)
●
無料
(20)
●
生活
(35)
●
画像
(89)
●
素材
(96)
●
統計
(24)
●
記事
(74)
●
調査
(30)
●
資料
(120)
●
開発
(100)
●
音楽
(29)
●
食
(17)
●
dev
(5914)
●
tips
(2428)
●
javascript
(1594)
●
webservice
(1500)
●
biz
(1022)
●
まとめ
(934)
●
app
(889)
●
idea
(847)
●
security
(730)
●
tool
(695)
関連タグで絞り込む (6)
●
browser
●
canvas
●
javascript
●
react.js
●
tips
●
video
タグの絞り込みを解除
devとmovieに関するko-ya-maのブックマーク (3)
●
77 users
●
coliss.com
●テクノロジー
動画、特に映画コンテンツを快適に再生することにフォーカスされたHTML5プレーヤーを実装するスクリプトを紹介します。 実装は非常に簡単でカスタマイズも豊富、字幕は多言語をサポート、動画の再生速度は0.1x-8xまで変更可能、デザインはCSSベースで簡単に変更できます。 Moovie.js デフォルトでも快適、フルカスタマイズも可能 動画の字幕は多言語をサポート 再生速度は0.1x-8xまで変更可能 .vtt, .srtの字幕ファイルをサポート トラックや字幕を動的に追加可能 字幕のカスタマイズ イベント・ショートカットのAPI 依存関係はなし、VanillaJSで構築 すべてのモダンブラウザをサポート レスポンシブに完全対応MITライセンスで、商用プロジェクトでも無料で利用できます Moovie.jsのデモ デモでは映画コンテンツを再生しながら、Moovie.jsのいろいろな機能を楽しめ
ko-ya-ma
2021/03/24
●javascript
●dev
●movie
●video
●
39 users
●
www.remotion.dev
●テクノロジー
Real .mp4 videosRemotion renders all frames to images and encodes them to a real video - audio support included. WebM and other formats are also supported. Fast and delightful editingPreview your video in the browser. Fast refresh while the video is playing. Scrub through the timeline to get every frame perfect. Programmatic content and renderingFetch data from an API and use itas the content. Di
ko-ya-ma
2021/02/09
●dev
●react.js
●video
●movie
●
133 users
●
qiita.com/massie_g
●テクノロジー
はじめに WebRTCを使ったアプリを作る際に、切っても切れないのがカメラ映像の取得です。ノート型のPCで作業したりすると、延々と自分の顔を見続けなければなりません。そこで、自分の顔の替わりに好きな動画をメディアストリームとして流すサンプルを作って見ました。 仕組み 動画ファイルの変換 ユーザにローカルの動画ファイルを指定してもらう︵ファイル選択orドラッグ＆ドロップ︶ FileオブジェクトからURLを生成 (window.URL.createObjectURLを利用︶ それをVideoタグで再生 継続的にCanvasタグに転写 (window.requestAnimationFrameを利用︶ CanvasタグからMediaStreamを取り出す (Canvas.captureStreamを利用︶ 音声ファイルの変換 ユーザにローカルの音声ファイルを指定してもらう︵ファイル選択or
ko-ya-ma
2016/07/27
●canvas
●movie
●dev
●tips
●browser
1
お知らせ
ランキング
今週のはてなブックマーク数ランキング︵2024年6月第5週︶
ランキング
今週のはてなブックマーク数ランキング︵2024年6月第4週︶
ランキング
今週のはてなブックマーク数ランキング︵2024年6月第3週︶
もっと読む
公式Twitter
●@HatenaBookmark
リリース、障害情報などのサービスのお知らせ
●@hatebu
最新の人気エントリーの配信
処理を実行中です
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
●総合
●一般
●世の中
●政治と経済
●暮らし
●学び
●テクノロジー
●エンタメ
●アニメとゲーム
●おもしろ
●アプリ・拡張機能
●開発ブログ
●ヘルプ
●お問い合わせ
●ガイドライン
●利用規約
●プライバシーポリシー
●利用者情報の外部送信について
●ガイドライン
●利用規約
●プライバシーポリシー
●利用者情報の外部送信について
●公式アカウント
●ホットエントリー
●はてなブログ
●はてなブログPro
●人力検索はてな
●はてなブログ タグ
●はてなニュース
●ソレドコ
Copyright © 2005-2024 Hatena. All Rights Reserved.
設定を変更しましたx
JavaScriptの外部ファイルで簡単に実装できる、映画コンテンツを快適に再生するHTML5動画プレーヤー -Moovie.js
Remotion | Make videos programmatically in React
WebRTCを試すときにオッサンが映り続ける問題に対処する - Qiita