タグ HTML5 and CSS
新着順 10 users 50 users 100 users 500 users 1000 usersリアルタイムでレイトレして、GIFに記録するヤツ - jsdo.it - Share JavaScript, HTML5 and CSS
FirefoxでもなんとかCanvasの内容を動画にしたくて 以前の作品でChromeではWhammyを使うことで、楽勝でVideoタグ要素を動的に生成することに 成功していたのだが、WebPをサポートしていない?Firefoxは2014年現在もこいつが 動かないので、なんとか、動的に作成したCanvasイメージをpure javascriptで 保存したいという熱い思いを実現したw さらに201... 続きを読む
CSS謝罪文 - jsdo.it - Share JavaScript, HTML5 and CSS
Readme JavaScript 0 lines HTML 1 lines SCSS / Compass 30 lines CSSによるインデックスされない謝罪文 CSSに本文が書いてあるので、画面上は表示されているがGoogleでのキーワード検索には引っかからない 「流出」などの嫌な単語は:beforeと:afterに「流」「出」を分けて書くことで、自然言語解析を回避 #s { p:first... 続きを読む
forked: Canvas上でテキスト入力 - tmlib.js 0.1.7 - jsdo.it - Share JavaScript, HTML5 and CSS
// forked from phi's "Canvas上でテキスト入力 - tmlib.js 0.1.7" http://jsdo.it/phi/7dBs // forked from phi's "template - tmlib.js 0.1.7" http://jsdo.it/phi/m68l /* * tmlib.js 0.1.7 */ /* * contant */ var SCREE... 続きを読む
ダイアログフォーム - jsdo.it - Share JavaScript, HTML5 and CSS
Readme JavaScript 325 lines HTML 53 lines SCSS / Compass 130 lines お題:思わず登録したくなる「登録フォーム」 意図 メッセージアプリでの登録をイメージして作りました 人とチャットしてるときはタイピングが苦じゃないってことで、クラウディアさんに来て頂きました クラウディアさん情報: http://msdn.microsoft.com... 続きを読む
今話題の第二回全国統一HTML5実力テストを受けてみた! - Webデザイン初心者向けのあれこれ
2013-01-23 今話題の第二回全国統一HTML5実力テストを受けてみた! HTML 皆さんこんにちは 今日はjsdo.itさんが主催する 第二回全国統一 HTML5実力テスト - jsdo.it - Share JavaScript, HTML5 and CSS http://jsdo.it/event/html5cat/2012/autumn/ テストを受けてみました。 最初の問題はWEB... 続きを読む
モーダルウィンドウ - tmlib.js - jsdo.it - Share JavaScript, HTML5 and CSS
// forked from phi's "tmlib.js 0.1.3 template" http://jsdo.it/phi/w6VG /* * メイン処理(ページ読み込み後に実行される) */ tm.main(function() { // モーダル化 var modalElm = tm.dom.Element("#myModal"); modalElm.modal(); // tm.do... 続きを読む
The 2nd Annual HTML5 Exam - jsdo.it - Share JavaScript, HTML5 and CSS
Editorial Supervision by Futomi Hatano(HTML5.JP Administrator) Shunpei Shiraishi (html5j.org Administrator) DeNA Co., Ltd. 続きを読む
The 2nd Annual HTML5 Exam - jsdo.it - Share JavaScript, HTML5 and CSS
Editorial Supervision by Futomi Hatano(HTML5.JP Administrator) Shunpei Shiraishi (html5j.org Administrator) DeNA Co., Ltd. 続きを読む
jQueryでフォームの値を取得する方法をまとめておくので、コピペでご利用ください。 | Ginpen.com
必要ならどうぞ。 デモ jQueryでフォームの値を取得する方法をまとめ – jsdo.it – Share JavaScript, HTML5 and CSS jQueryでフォームの値を取得する方法をまとめ – jsdo.it – share JavaScript, HTML5 and CSS 共通:要素の探し方 input要素なんかにid振っちゃうのが一番なんだけど、属性セレクターを使うと楽... 続きを読む
CSS LED - jsdo.it - Share JavaScript, HTML5 and CSS
<div class="led-red"></div> <div class="led-yellow"></div> <div class="led-green"></div> <div class="led-blue"></div> body { padding: 100px; background-color: #222; } .led-red { margin: 20px; width: 1... 続きを読む
ブラウザゲームをスマホで操作できる!jsdo.it WebSocket Controller - jsdo.it - Share JavaScript, HTML5 and CSS
スマートフォンのブラウザとPCのブラウザをWebSocketで 接続するコントローラーです。 jsdo.itならWebSocketを用いたゲームをいますぐ作成できます。 お手持ちのスマートフォンで、右のQRコードを読み取るか、 -- にアクセスしてください. 続きを読む
ブラウザゲームをスマホで操作できる!jsdo.it WebSocket Controller - jsdo.it - Share JavaScript, HTML5 and CSS
ブラウザゲームをスマートフォンで操作できる jsdo.it WebSocket Controller でHTML5ゲームをつくろう! @ jsdo.it - share JavaScript, HTML5 and CSS - jsdo.it is a service to write JavaScript, HTML5, CSS in your browser and share it. You ... 続きを読む
Web Creator's Contest Q - jsdo.it - Share JavaScript, HTML5 and CSS
自分を、試す。未来を、拓く。 “Q”は、すべてのWebクリエイターのための、アイデア&スキルコンテスト。 「HTML5」「CSS」「JavaScript」など得意スキルを活かしてお題にチャレンジ。 優秀者には豪華賞品を贈呈。 ビジネスSNS「Biz-IQ」上で、協賛企業からスカウトメールが届く可能性も。 皆さんの挑戦を、お待ちしています。 続きを読む
このコードがなぜ意図通りの順番で読み込まれないのかの理由と、どのように書けば意図通り読み込まれるか教えてください。。。 - jsdo.it - Share JavaScript, HTML5 and CSS
Submit a question You can submit JavaScript, HTML, CSS related questions with embedded reference to actual codes and get the answers likewise. Ask a question 1. Click the ‘submit a question’ above 2. ... 続きを読む
ワンクリックRPG。forked: CSSで必殺技! - jsdo.it - Share JavaScript, HTML5 and CSS
safariでみてください! 下記追記を読んでいただきたいのですが webkit系人によっては(safari)のみで確認できます。 と言うかそれ以外で見れません。 重くてすみませんw 楽しかったです!そして、ちょい疲れたw また、こういうのがあれば挑戦します! ソースが汚くてすみませんでした^^; ちょっと、落ち着いたら 軽量化しますw色々ひどいw ※『ッ』は仕様です。 最後に一言「チキンレース!... 続きを読む
SPEC | JavaScript、HTML、CSSクリエイターの採用試験 - jsdo.it - Share JavaScript, HTML5 and CSS
DeNAのゲームに使用されている素材を自由につかってCSSだけでバトル画面の必殺技を作成したり、ファイルサイズを押さえたローディングの演出など考えていただき、HTML5,CSS3などを用いてオリジナリティあふれる作品を投稿してください。優秀作品者には、豪華賞品を贈呈させていただきます。【素材をダウンロードしてチャレンジする】 DeNA ディー・エヌ・エー(DeNA)は、日本、英語圏、中国語圏を中心... 続きを読む
とてもとても簡単な、jQueryプラグインのつくりかた。 | Ginpen.com
先日Yokohama.jsでちょろっとお話しして来ました。 先に完成品 こんな感じのものをつくります。 とてもとても簡単な、jQueryプラグインのつくりかた。 – jsdo.it – share JavaScript, HTML5 and CSS 仕様 クリックするたびに色が変わる、というものにしましょう。色は引数で渡します。 こんな感じで使います。 $('.rotate_colors').ro... 続きを読む
任意URLのいいね!数が取れるようになったらしい - jsdo.it - Share JavaScript, HTML5 and CSS
var likeCount = function(_id ,_url) { if(!_id) return; var pageURL = (_url) ? _url : location.href; var callback_name = 'jsonp_' + _id; var url = 'http://graph.facebook.com/' + pageURL + '&callback=' ... 続きを読む
HTML5 Coding assessment test - jsdo.it - Share JavaScript, HTML5 and CSS
The duration of the test is set to 15 min. The measuring starts as soon as you begin the test. ※There is no penalty for overtime. Login Now, log into jsdo.it and begin the test! login with Google logi... 続きを読む
これは簡単! a要素にクラスを追加するだけでiPhone UIボタン | CSS-EBLOG
これは簡単! a要素にクラスを追加するだけでiPhone UIボタン カテゴリ:iPhone関連 2011年8月29日 09:05 ↓実際に動いているデモはこちら(iPhone向けに作っているため、iPhone / WebKitでしか最適化されていません) これは簡単! a要素ひとつでiPhone UIボタン - jsdo.it - share JavaScript, HTML5 and CSS ... 続きを読む
スマートフォンの「傾き」や「加速度」の使い方を覚えよう!デモコードですぐに試せます! - jsdo.it - Share JavaScript, HTML5 and CSS
QRコード jsdo.itのコードをスマートフォンで見るには? コードをスマートフォンで表示するにはQRコードが便利です。 コードページの右下にある「QR Code」ボタンをクリックするとQRコードが表示されます。 表示できたらスマートフォンを傾けて数値が変化することを確認します。 一度机の上などにおいて静止した状態から変化を見るとわかりやすいと思います。 数値を取得するコード var x = $... 続きを読む
演出力はJSer・コーダー・デザイナーの必修科目!アニメーションの基礎を5種類のパターンで身につけよう! - jsdo.it - Share JavaScript, HTML5 and CSS
Tweet 動きを実装するのはFlash Developerだけのものではなくなりました。 お手本コードをフォークしてアニメーションの基礎を学びましょう! 課題 基礎的な5つの動きに挑戦してみましょう。 サンプルコードをアレンジ(フォーク)して、「普通に」「ドンッて感じで」「シュッと」「生きている感じ」「意外性を出して」の動きをつけてください。 (アニメーションのリクエストはいつもふわっとしてるも... 続きを読む
一夜漬けでCSS3をマスターするために見ておくべきコードのまとめ - jsdo.it - Share JavaScript, HTML5 and CSS
jsdo.itに投稿されたCSS3のコードのなかから、実用的なものからネタ系のものまで厳選して集めました。 Tweet jsdo.itに投稿された800以上のコードのなかから、実用的なものからネタ系のものまで厳選して集めました。 これだけ見ておけばCSS3で何ができるのか、何を勉強したらいいのかがだいたいわかる!(はず) display:boxを使ったレイアウト CSS3の数行で作る簡単な3カラム... 続きを読む
CSS 3D WORLD - jsdo.it - Share JavaScript, HTML5 and CSS
子オブジェクトから親オブジェクトへの参照 - jsdo.it - Share JavaScript, HTML5 and CSS
Hogeからは子オブジェクトが存在するかどうか分からない (自分が親になっているのかどうか分からない)ので Hoge内から子オブジェクトに関する記述を行うことはできません。 この場合、Hogeを継承する子オブジェクト(子クラス)を作成し、 その中から上位クラス(.prototype拡張されているクラス)を参照することになります。 JSの場合、オブジェクトの継承関係は.prototypeの継承関係で... 続きを読む