タグ css3 が登録されている動画 ： 17 件中 1 - 17 件目
種類:
- タグ
- キーワード
対象:
2010年の2ちゃんねる （HTML5で作りました)
10年くらい前に流行った2ちゃんねるのFlash動画風に、2010年の2ちゃんねるをHTML5で動画にしてみました。
HTML5版は、http://www.tatsuaki.net/2ch2010/ です。
#1 導入と環境構築【HTML5入門】
HTMLとはなにか。始める前の準備をします。※キーボードの打鍵音がうるさいかもしれませんが、#2から改善しています。
しゃべりが下手なので、Webサイトを作ってそこに詳しくじっくり書いていくことにしました！
HTML5/CSS3の超教科書 | http://prog.guide/html5-css3/
|| #2 → sm30175859
Twitter → @ithat_me
01 : HTML5入門：mylist/57685012
ZenzaWatchコメント投稿テスト用
GooglePhotosで自動生成された動画をそのまま投稿。
コメント投稿テスト用として自由にお使いください。
なんか面白いアイデアや報告が書いてあったら適当に拾います。
ここなら誰でも書きやすいと思います。 実現可能かどうかなんて気にしないで、気軽にどうぞ。
入力欄は「C」を押せばいつでも呼び出せます。超便利。
しかも本家と違って、フルスクリーンでも入力可能。
FlashとFirefoxの相性に悩まされることもありません。#テスト
【ZenzaWatch】Androidでも動いた。 しかもヌルヌルじゃないですかー.mp4
実用性はともかくAndroidでも動いたーやったー！ しかも公式よりぬるぬるじゃないですかー！
ブックマークレットはここから登録できるので、試してみたい方はどうぞ -> http://makimo.to/Zenza/
詳細やお借りした動画は後ほどブロマガのほうに書きます。
なおiOS版Chromeでも動くことは動きましたが、正直微妙なのでお勧めしません。
なぜか明朝とゴシックが逆になったり、不思議な挙動をします。
#2 テンプレートとHello World!【HTML5入門】
HTMLの基本となるテンプレートの作成とHello World!です。
しゃべりが下手なので、Webサイトを作ってそこに詳しくじっくり書いていくことにしました！
HTML5/CSS3の超教科書 | http://prog.guide/html5-css3/
sm30166509 ← #1 || #3 → sm30182020
Twitter → @ithat_me
01 : HTML5入門：mylist/57685012
【ZenzaWatch】replace機能実装中のテスト(まだ不完全)
Zenzaの描画システムは、言うならば「コメントのJITコンパイラ」である。
再生時に、コメント(XML) → 中間コード → CSS3 http://makimo.to/Zenza/SenbonZakura.html
への変換が行われる。
あとはコンパイルされたhtmlを、動画に合わせて表示位置を変えるだけ。
中間コードのおかげでフォントや解像度の変化にも強い。
ニワン語の対応は自分の技量でどこまでできるだろうか？ 作った人は本当に凄いと思う。 (これが動画プレイヤーに必要なのかは激しく疑問だけど・・・)
今回お借りした動画はこちら sm17367353
@逆再生はこちらで確認できます。sm6328375
@デフォルト(色)はこちらがオススメ sm19550074
そのうち書きたくなったらニコナレかどこかに解説を上げます。
Amazon FireTVでZenzaWatchを動かしてみる
準備がめんどくさいしマウス必須だし、正直おすすめはしない。
(まあこんな事もできますよってことで…)
やり方は、最初にChromeを持ってくる以外はAndroidと同じです。
参考: ar977276
FireTVでは快適だけど、Stickではさすがに厳しそう。機会があれば、誰かから借りて試してみたいです。
CSS3で3DCG風アニメーションに挑戦 中ボス程度のキャラ大暴れ！SPMonster
前回に引き続きCSS3/HTML5でアニメーションに挑戦。
今回は何と3DCG風のアニメーション。
しかも、わざわざ曲までつくっちゃた。
demoサイト http://conyanco.tk/demo/monster.php
楽曲ダウソ https://soundcloud.com/nama-labo/steelplantsmonster
CSS3でアニメーション実験！思い付きの力技でねじ伏せてみる
HTML5/CSS3を使った描画の実験でアニメーション的な表現がどこまでできるか試してみた。
また、閲覧環境がさまざまな状況でなるべく近い状態でなおかつ割と手間を掛けずに対処する方法を思い付きで実装した力技の実験である・・・
demoサイト http://conyanco.tk/portfolio/
#6 フォームとその部品【HTML5入門】
お問い合わせなどに使われるフォームの基本。
しゃべりが下手なので、Webサイトを作ってそこに詳しくじっくり書いていくことにしました！
HTML5/CSS3の超教科書 | http://prog.guide/html5-css3/
sm30226104 ← #5 || #7 → 再開までもう少しお待ちを
Twitter → @ithat_me
01 : HTML5入門：mylist/57685012
#5 リストとテーブル【HTML5入門】
色々なリストとテーブルの作成。
しゃべりが下手なので、Webサイトを作ってそこに詳しくじっくり書いていくことにしました！
HTML5/CSS3の超教科書 | http://prog.guide/html5-css3/
sm30195764 ← #4 || #6 → sm30245302
Twitter → @ithat_me
01 : HTML5入門：mylist/57685012
#3 タグの分類とテキスト【HTML5入門】
大まかなHTMLタグの分類とテキスト関連のタグについて。
しゃべりが下手なので、Webサイトを作ってそこに詳しくじっくり書いていくことにしました！
HTML5/CSS3の超教科書 | http://prog.guide/html5-css3/
sm30175859 ← #2 || #4 → sm30195764
Twitter → @ithat_me
01 : HTML5入門：mylist/57685012
#4 画像と相対絶対パス 【HTML5入門】
画像の表示と混乱しがちなパスについて。※alt属性の略はalternateです。タイピングミスりました。
しゃべりが下手なので、Webサイトを作ってそこに詳しくじっくり書いていくことにしました！
HTML5/CSS3の超教科書 | http://prog.guide/html5-css3/
sm30182020 ← #3 || #5 → sm30226104
Twitter → @ithat_me
01 : HTML5入門：mylist/57685012
【ATOM】ASUS VivoStick TS10でZenzaWatchをためしてみる 【CherryTrail】
前世代のスティックPCでも普段は問題なかったのだけど、高画質系動画でスローになってしまうのが残念だったので、新型はどうなの？というのを試してみました。(本当は無駄遣いしたかっただけ)
3倍速とか無茶させなければ結構イケるようです。
このテストではコメントがカクついてるけど、普通の動画ならヌルヌルです。
GINZAは相変わらず重いです。
お借りした動画はこちら: sm28539679
こんな動画を選んでおいて言うのもなんですが、実はアイマスよく知らなかったり。。。
【荒ぶる坊主】Steel Plants Monster Ver2【HTML5 CSS3 3DCG風 animation】
HTML5 CSS3を使用したアニメーションを無理くりヴァージョンアップしました。
win8 & chrome環境でキャプチャした映像です。
公開サイト http://conyanco.tk/monster
BGM Download https://soundcloud.com/nama-labo
【自作WEBアプリ解説】JR東海風の駅名標を自動生成できるプログラムの概要・使い方を解説！【VOICEROID解説】
【ジェネレーターはこちら】 https://lemon-slime.com/?p=839
【Youtube動画はこちら】https://youtu.be/rULypGzeuKw
本ジェネレーターを用いることで、JR東海風の駅名標を簡単に量産することができます。是非、ご活用ください。 本動画では、このジェネレーターの使い方及び概要を解説します。いわゆる、「公式ドキュメント」の動画版です。
【使用素材・ソフト】
琴葉姉妹の立ち絵素材 / ユメのオワリ様 琴葉葵（voiceroid音声） YMM4 われは海の子（BGM） HTMLとjavascript