DOMから始めるJavaScriptモダン・スクリプティング---目次：ITpro
近年，Ajaxの台頭をきっかけに，JavaScriptを使ったブラウザのリッチ・クライアント化が進んできました。現在では，ページの表示を変化させるだけであれば，ほとんどのことはJavaScriptのみで対処することが可能です。それを実現するのがDOMなのです。 第1回 DOMから始めるモダン・スクリプティングの世界へようこそ 第2回 ブラウザからHTMLはどう見えているかを理解しよう ～ドキュメントツリー～ 第3回 DOMスクリプティングのことはじめ(1) ～要素（タグ）を狙い撃ち～ 第4回 DOMスクリプティングのことはじめ(2) ～これはどんな要素？～ 第5回 DOMを使ってHTMLを自由自在に書き換える 第6回 イベントハンドラから脱却しよう 第7回 スクリプトを完全に分離しよう ～コンテンツ，プレゼンテーション，ビヘイビア～ 第8回 スクリプトのパッケージ化 ～使い回しできるスクリ
具体例で説明するデザインパターン - てっく煮ブログ
JavaScriptデザインパターンってなんだかたいそうなものに考えられがちだけど、実は、そこかしこのライブラリや仕様に取り込まれていることが多い。「デザインパターン分からん」とか「で、どうやって使うのよ」と悶々としている人には、「どういうところで使わているのか」を知っておけばイメージも沸きやすいし、意外にたいしたことないんだな、ということが分かるんじゃないだろうか。そこで、JavaScript やその周辺の技術で、デザインパターンがどのように使われているかを紹介してみることにする。ここでは、GoF本の順番に沿って、以下の11個のパターンを取り上げる。生成に関するパターン Factory MethodAbstract FactoryBuilderPrototypeSingleton構造に関するパターン AdapterComposite振る舞いに関するパターン Chain Of Respon
「Ajax？ 知ってますよ」と言えますか：ITpro
新人配属や異動の季節になった。この4月，あなたがもし新しい職場に配属されて，上司から「君，Ajaxって知ってる？」と聞かれたとする。そのとき，堂々と「知ってますよ」と答えられるだろうか？ このITproのサイトでは，Ajax，マッシュアップ，リッチ・クライアント，SaaSなどいわゆるWeb2.0関連の記事が一昨年ぐらいから毎日のように掲載されている。そもそもITproはこうした言葉を知っている読者を対象にしているので，ほとんどの読者は冒頭のような質問を受けても，「知ってますよ」と堂々と答えられるだろう。しかし，この春初めてITの世界に入る人の中には，「名前や概念的なことなら分かるのですが…」という人も多いのではないだろうか。 そこで今回の記者の眼では，そういう新人君にお勧めな「Ajax学習法」を考えてみた。といっても，要するに，実際に自分でちょっとしたプログラムを作って試してみるだけである
Ajaxを勉強しよう
このページはAjaxを勉強してみたい人向けの学習用ページです。サーバーを入れ替えたため一部CGIを使用したものが動作していません。時間のある時に修正します。また、書いてから、かなり時間が経過しているため内容的に古いものもあります。ご了承ください。 Ajaxで利用されるエフェクトに関しては別ページ(Ajax Effect)に移動しました。 Ajax関連書籍に関してはAjax関連書籍一覧ページを用意しました。 Prototype系ライブラリ サンプルプログラム【New !!】のページを用意しましたので、Prototype系のライブラリを利用している方は参考にしてみてください。 ミスや間違いなどがありましたらopenspc@po.shiojiri.ne.jpまでお願いします。 第一章 Ajaxって？ AjaxとRIA AjaxとDHTML AjaxとFlash Ajaxに必要な知識と技術 Aja
Ajaxを使った非同期通信
Ajax とは Asynchronous JavaScript + XML の略で、 Web サーバーとブラウザとの間で非同期通信を行う方法です。 Ajax の方法を利用することで、ページを切り替えることなくページの内容を書き換えることができるようになります。 JavaScript では Aax を用いた非同期通信には XMLHttpRequest オブジェクトを使用します。ここでは Ajax を使った非同期通信を行う方法について解説します。
Ajax : 勉強用サンプル&解説
■Ajax : 勉強用サンプル&解説 Ajax (Asynchronous JavaScript+XML) がどのようなものか勉強用としてページやサンプルを作成しましたので参考にしてみてください。 最終更新日：2017/12/16 AM 9:27 Ajaxを勉強しよう jQuery入門 【短期集中連載】この冬作ろう！jQueryプラグイン講座 上のjQueryプラグイン講座の続き 【第13回を追加】 Yahoo UI Library入門 WebDesigning掲載サンプル マイコミジャーナル記事 (Ajax関連) Ajax エフェクト Ajax関連書籍一覧 Ajax ライブラリ一覧 Webサービス APIサイト一覧 Ajax ライブラリリファレンス Prototype系ライブラリ サンプルプログラム 逆引きAdobe Spryリファレンス Google Maps API リファレンス G
ITmedia エンタープライズ：Ajaxを理解する4つのポイント (1/6)
Ajaxはどのように実現されているのだろうか？ こんな疑問に応えるべく、サンプルを挙げてみよう。Ajaxの基本は、単に「JavaScriptでHTTP通信をする」というだけに過ぎないことが分かる。 オンライン・ムックPlus「Web2.0で変わるWebプログラミングの常識」の第1回目では、Ajaxが使われる背景と、どのような場合に適しているかを解説した。 今回はサンプルアプリケーションを取り上げていこう。ポイントは、もっとも基本的な例に限定したことであり、開発者である読者が今すぐにでも既存のWebアプリケーションへ組み込むことができるよう配慮した点だ。 まず最初に、以下の図2に示す2つのテキストボックスに注目してほしい。その「和」と「差」をそれぞれ計算し、結果を埋め込むという処理を挙げてみよう。 「和」と「差」を計算する処理の部分は、サーバ側に用意したPHPプログラムで行うことにする（図3
データ ＆ アナリティクス | アクセンチュア
データ分析から導き出されたインサイト無しにAI（人工知能）の活用は始まりません。私たちは、各業界知識とデータ・アナリティクス技術を駆使しデータドリブン経営を強力に支援します。 データ、アナリティクス、AIは企業にとって競合他社との差別化を図るかつてないほど大きな要因になっています。今日の経営幹部が効率を向上しながら新たな収益源を開拓し、新しいビジネスモデルをタイムリーに構築する方法を模索する中、価値を生み出し成長を続ける企業には「データ活用」という共通項があります。私たちは、無数のデータから企業にとって本当に必要なデータを活用するための方法を知っています。 将来を見据えたオペレーション体制を備えている企業の半数以上（52％）は、すでにデータとアナリティクスを大規模に活用しています。データとAIに関する取り組みをビジネス戦略に沿って実施することで投資利益率を迅速に最大化し、最終的にはAIをビ
JavaScriptのDOM Core基礎 - 三等兵
Coreの簡易リファレンス。Coreは要素を参照したり、相対位置から周りのノードを参照したり、要素を生成するといった部分。主に利用するであろうプロパティやメソッドはカバーしているつもりですけど、これも入れとけってのあったら教えてください。 このあたりは地味で使いづらくその上理解しにくいという残念な部分。ふと忘れたときに使う個人的なものですが、慢性jQuery拒絶症候群な人よかったらどうぞ。それにしても暑い。ガリガリ君おいしいね。 DOMとは。 Document Object Model (DOM) は、HTML および XML ドキュメントのための API です。これはドキュメントの構造的な表現を提供し、内容や表示形態の変更を可能にします。端的に言えば、Web ページをスクリプトやプログラミング言語とつなぐような機構です。 https://developer.mozilla.org/ja/
TwitterやFacebookのURLには、なぜ#!が含まれるのか (SEOとAjaxのおいしい関係) - kazuhoのメモ置き場
Ajaxを使うためにはページ内リンク (hash fragment=URLの#以降) を使うのが一般的*1 hash fragmentはサーバに送信されないから、JavaScript非対応のブラウザだと動作しない 特にサーチエンジンのクローラ等で問題になる*2 そこで Google は、#! が含まれる URL を hash を含まないものに読み替える仕組みを提唱している。例えば「www.example.com/ajax.html#!key=value」のサーチエンジン用URLは「www.example.com/ajax.html?_escaped_fragment_=key=value」になる。 TwitterやFacebookはこの仕様に従うことで、Ajax な UI と SEO を同時に実現している、というわけ。ということを調べたなう。 参照: Getting Started |
W3C - W3Cの仕様書等の文書の日本語訳集
注意 日本語翻訳集は w3c-translators@w3.org メーリングリスト上で報告された日本語翻訳文書へのリンクを集めたものです． リンクされた翻訳はボランティアによって行われたものです． またこれらの翻訳には誤りが含まれる可能性もあります． 正式なものはあくまでも英語版ですので， この点をご理解頂いた上でご利用下さい． またコピーライトに関する情報を含め，W3Cの文書の翻訳に関しての一般的な情報や， 翻訳の際のヘルプは， http://www.w3.org/Consortium/Translation/にあるW3C翻訳ページ(英語版) をご覧下さい． TR集 勧告 ・ 勧告案 ・ 勧告候補 ・ 草案 ・ 技術ノート その他の文書等 FAQ集 ・ その他 TR集 勧告 HTML 4 (勧告) http://www.asahi-net.or.jp/~bd9y-ktu/html4re
W3C - 『HTML 5 differences from HTML 4』日本語訳 - HTML5.JP
一部、直訳ではなく意訳した部分がございます。原文と表現が異なることがございますので、ご了承ください。この日本語訳は、私が理解を深めるために、自分なりに日本語化したものです。本日本語訳には、翻訳上の誤りがある可能性があります。したがって、内容について一切保証をするものではありません。正確さを求める場合には、必ず原文を参照してください。当方は、この文書によって利用者が被るいかなる損害の責任を負いません。もし誤りなどを見つけたら、当サイトのお問い合わせより連絡いただければ幸いです。 原文URL：http://www.w3.org/TR/2011/WD-html5-diff-20110525// 原文タイトル：HTML 5 differences from HTML 4 - W3C Working Draft 25 May 2011 翻訳日：2011/05/26 最終更新日：2011/05/26
2011年 はてブ数ランキングベスト５０ 今年最後に見ておきたい良質記事まとめ | 世界ろぐ
This domain may be for sale!
ここまで教えてくれていいの？！WEB屋のテンションと底力を上げる厳選チュートリアル色々！ | バンクーバーのうぇぶ屋
WEB制作のチュートリアルって本当に多いですよね。 でも、本当に役に立っている、制作に生かせてるチュートリアルって少なくないですか？チュートリアルの過程が中途半端だったり、途中からついていけなくなったり。はたまた、続きは有料なんて物も今までありました。 しかし！僕の短いWEB屋人生ですが、年に2、3は『お、おぉぉ！マジテンション上がるWA！』と叫びたくなるチュートリアルに出会うことが稀にあります。そんな感銘を受けたチュートリアルは速攻でFacebookにアップしているのですが、今回は今日まで見てきた中で、余りにクオリティが高かったり、確実に自分や周りのスキル、そしてテンションを上げたチュートリアルを厳選してご紹介！ 英語記事メインですが、デザインよりならステップbyステップなのでなんとかなります！コードなら、Demoとか多いので見ながらついていけば理解できます！是非参考までに流し読みして見
gadget-or-gimmick
ถ้าไม่มีอะไรอย่างอื่น สล็อต ต้องขอบคุณ Naraka Bladepoint ที่เป็นหนึ่งในไม่กี่ชื่อ Battle Royale ที่การถูกยิงโดยใครบางคนที่ สล็อต...
Webデザインの“ブブン”を集めたブブンデザインアーカイブ 公式サイト
タグ一覧 タイトルロゴ(159) プライマリナビゲーション(72) グローバルナビゲーション(246) メインビジュアル(95) 見出し(326) 文字装飾(10) アクセント(29) サイドメニュー(142) ログインフォーム(68) タブ(55) テーブル・表(23) 地図(12) 特集バナー・内部リンク(525) Twitterアイコン・バナー(64) RSSアイコン・バナー(41) フォーム(9) アイコン(195) ＜前へ 次へ＞(12) 検索窓(149) パンくずリスト(12) このページのトップへ戻る(52) フォントサイズ変更ボタン(34) 問合せ・送信・購入ボタン(72) 電話番号(41) フッター・コピーライト(99) ニュース・ポータル・検索(207) ファッション(200) 音楽・ゲーム・コンテンツ配信(58) ネット関連サービス(86) オンラインショップ(308
ロゴ・デザイン デサイナー向けまとめサイト | デザインIDデータベース
This domain is registered at NameSilo. If you are the owner, start administering it at NameSilo.com. If this is not your domain, find similar names that work for you. This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it
国産のWebデザインギャラリーサイトが一番参考になるのでまとめた - かちびと.net
Webデザインのギャラリーは沢山 ありますが、結局感性の近い国産 のギャラリーが一番参考になるの でまとめました。探してみると結構 いろいろあるんですね。助かります。 やはりギャラリーは国産がいいですね。沢山あるので、ある程度厳選しています。 io3000 最近知りました。すごくいいですね、ここ。見やすいし、使いやすいです。おすすめ。 io3000 straightline bookmark とにかくクールでクオリティの高いサイトをブックマークしているギャラリー。 straightline bookmark Web Design Clip こちらも個人的にオススメのギャラリーサイトです。目的のデザインも直ぐに見つかりますよ。 Web Design Clip Good Design Web こちらは他ではあまり見かけない良デザインのサイトを紹介してる貴重なギャラリーです。 Good Desi
WordCamp Tokyo 2011、ありがとうございました！
11月27日（日）、WordCamp Tokyo 2011に出演させていただきました。 「早く・良いものを作るための、WordPressサイト構築ワークフロー」というタイトルで30分、ワークフロー全体の話ではなく、ワークフロー中でハマる場所と対策についてを、経験談多めでお話ししました。 予想外の満員状態に、ど緊張してしまいましたが、なんとか無事に終わりほっとしました。 聞いてくださったみなさま、本当にありがとうございました。少しでもお役に立てたなら幸いです。 スライドは以下です。 公開用に一部削除したり、口頭だけで説明したわかりにくいところにメモを追加したりと、調整しました。 メモの字が小さいですが、読みにくい場合は SlideShare からPDF�をダウンロードできますので、ご利用ください。 午前中に出番が終わったので、その後は存分にほかのスピーカーさんのセッションを満喫。いろんなセッ
WordCamp Tokyo 2011 「実践！ オリジナルテーマで作るスマホサイト＆マルチスクリーンサイト」
24. $this->addBrowser(new BrowserUA('safarimobile', 'Safari Mobile', null, '^Mozilla/5.0 (.*) AppleWebKit/.* (KHTML, like Gecko)( Version /.*){0,1} Mobile[/A-Z0-9]{0,}( Safari/.*){0,1}$', 'webkit,mobile')); $this->addBrowser(new BrowserUA('safarimobile', 'Safari Mobile', null, '^Mozilla/5.0 ((iPhone|iPod).*) AppleWebKit/.* (KHTML, like Gecko )( Version/.*){0,1} Mobile[/A-Z0-9]{0,}( Safari/.*){0,1}
一日で学ぶ jQuery(ラボブログ)
スパイスラボ神部です。 OpenSocial アプリの開発を効率化するために、jOpenSocial か opensocial-jquery のどちらかを使いたいのですが、そのためにはまず jQuery について学ばないと行けないようなので、jQuery についてざっと調べてみました。 -AJAXが好きだ！ - Favorites! Write less, Do more -jQuery: The Write Less, Do More, JavaScript Library まずは公式。 リファレンス -jQuery 1.3.2 日本語リファレンス 参考になりそうなリソース いろんな記事を見ると、とりあえずは jQuery を使うと、構造化された状態でリッチアプリケーションが組めるという部分が強調されている記事が多いような気がします。「jQuery + AJAX で RIA な UI
最近気になってきたjQueryについて色々調べてみました - もとまか日記
最近、「jQuery」というキーワードをよく見かけます。 これって何だろ？と思ったので調べてみたら、JavaScriptのライブラリのようで。 てことで、最近ちょっと気になってたJQueryについて調べてみました。 jQueryの概要 まずは難しいことは抜きにして、以下を読んでみると分かりやすいです。 はじめてのjQuery jQuery仕様関連 一応ですが、仕様について。 jQuery 日本語リファレンス 必要に応じてみればいいかな？と思ってるので、まだ細かくは見てません。 初心者向けの基礎知識、基礎講座 最初は初心者向けの記事を読んでみると良さそうです。 ASCII.jp：40分で覚える！jQuery速習講座一晩で覚えるjQueryの逆引き基礎サンプル7つjQuery事始め・コピペに頼らず、基礎知識を理解して実際に動かしてみるjQuery 開発者向けメモ サンプル、プラグイン 調べてて
ノンプログラマーのためのjQuery入門
kanazawa.js v1.0 〜JavaScriptコトハジメ〜（2011年2月5日開催）で使用したスライドです。Read less
14のjQueryベストプラクティス[to-R]
14のjQueryベストプラクティス 原文:14 Helpful jQuery Tricks, Notes, and Best Practices 良かったので翻訳してみました。かなりの意訳で、上手に訳せてない箇所も多いので詳しくは原文を参照してください。 1.メソッドはjQueryオブジェクトを返す ほとんどのメソッドがjQueryオブジェクトを返すのが重要です。 これにより次のようなメソッドチェーンが可能になっています。 $someDiv .attr('class', 'someClass') .hide() .html('new stuff'); jQueryオブジェクトを返すのがわかっていれば次のように分割して書くことも出来ます。 var someDiv = $('#someDiv'); someDiv.hide(); 次のように一行で書くことも出来ます。 var someDiv
![14のjQueryベストプラクティス[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)
jQueryを学ぶためのリンク集
1. 概要の理解 jQueryを一切知らない場合はまずは概要の理解から始めます。 ノンプログラマーのためのjQuery入門 http://www.slideshare.net/hayatomizuno/jquery-7665168 はじめてのjQuery http://higashizm.sakura.ne.jp/jquery_first/ 2. 基本的な使い方を理解する サンプルを見ながら具体的なコードを作成し理解を深めます。 40分で覚えるjQuery速修講座 http://ascii.jp/elem/000/000/498/498710/ jQuery基礎文法最速マスター http://blog.webcreativepark.net/2010/02/02-111519.html jQueryサンプル集 http://www.designwalker.com/2008/04/jque
jquery [DokuWiki]
jQueryは軽量のAjaxフレームワークです。JavaScriptの標準的なコーディングとは異なりますが、非常に短いコードで大きな効果があるスクリプトを記述できるようになります。prototype.jsがRuby風に記述できるライブラリだとすればjQueryはCSS風にJavaScriptを記述できるライブラリといえるでしょう。 主な特徴としては以下のとおりです。
jQuery入門
このページはAjaxライブラリの1つであるjQueryライブラリを勉強したい人向けに用意されています。 jQueryはバージョンによって記述方法が異なる場合があります。ここでは、バージョン別にページを用意するようにしてあります。 Ajaxライブラリで有名なものとしてはPrototypeライブラリやYahoo UI Libraryなどがあります。jQueryはPrototypeライブラリなどと併用することもできるようになっています。 ミスや間違いなどがありましたらopenspc@po.shiojiri.ne.jpまでお願いします。 jQuery入門 (ver 1.2.1) jQuery入門 (ver 1.2.2) jQuery入門 (ver 1.2.3) jQuery入門 (ver 1.2.4) jQuery入門 (ver 1.2.5) jQuery入門 (ver 1.2.6) jQuery
2010年度版・とても参考になった国内のWeb制作関連エントリーまとめ - かちびと.net
少し気が早いですが、今年も残すところ あと僅かです。ここで、Web制作をする にあたって、個人的に、とても参考にな った素晴らしいエントリーをご紹介します。 基本的にまとめ記事が大好物なので、 まとめのまとめ、という形になってしまい ますがご了承願います。 まぁ、単なる個人的なメモです。今年はお世話になりました、という感謝の意を込めてリンク&トラフィックで返したいのと、自分の復習用リンク集です。来年もたぶんお世話になる記事だと思いますので、備忘録も兼ねて。順不同です。 尚、当ブログのエントリは御礼の場であるこの記事では割愛しています。後日、別記事にてまとめさせて頂きますので、宜しければ御覧ください。 デザイン 読み物系が多いです。正月とかで見直す用。 配色パターンからWebデザインを考える ウェブデザインでこれは気をつけたいの35のポイント デザインQRコードの作り方 非デザイナーのための
jQueryを良くする25のTIPS
jQueryを良くする25のTIPS ネタ元：Improve your jQuery - 25 excellent tips ちょっと多いですが、かなり良いTIPSがまとまっています。 Google AJAX Libraries APIを利用しよう Google AJAX Libraries APIを活用すればすばやくライブラリを読み込むことが出来ます。 <script src="http://www.google.com/jsapi"></script> <script type="text/javascript"> // Load jQuery google.load("jquery", "1.2.6"); google.setOnLoadCallback(function() { // Your code goes here. }); </script> 直接読み込むことも出来ます。
jQuery を高速に使う CSS セレクタの書き方 - てっく煮ブログ
JavaScriptjQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを５つに絞って紹介します。何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある※ この記事は jQuery 1.2.6 のソースコードを元に記述しています1. 何度も同じセレクタを実行しない改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){
jQueryプラグインのベストトレンド総まとめ2010*ホームページを作る人のネタ帳
もはやこの業界ではかなり浸透しつつあるjQuery。 今回はそんなjQueryにスポットを当て、本年度紹介された中でも、ホットなトレンドプラグインをご紹介します。 ※プラグインつかってないのもあります。 １）3D表示プラグイン サンプルデモ 今年のトレンドと言えば3D。 というわけでこちら。まずはサンプルデモを確認。 触ってわかる通りですが、2枚の画像が3D表示されます。 呼び出す $(function() { $('#mindscape').smart3d(); }); HTML <ul id="mindscape"> <li><img src=".../mindscape1.png" /></li> <li><img src=".../mindscape2.png" /></li> </ul> CSS #mindscape { width: 720px; height: 170px;
データマイニングの基礎
データマイニングの基礎 - Presentation Transcript iAnalysis合同会社 最高解析責任者 倉橋一成 1 博士課程：東京大学疫学・生物統計学教室（2011年3月卒） 現在：東大病院企画情報運営部 ◦ 最先端プロジェクト ◦ 電子カルテのデータマイニング ブログ：Issei’s Analysis ～おとうさんの解析日記～ ◦ http://d.hatena.ne.jp/isseing333/ iAnalysis合同会社（アイアナリシス） ◦ 最高解析責任者（CAO） ◦ http://ianalysis.jp/ ◦ 解析＆コンサル＆家庭教師しています レセプトデータ マーケティングデータ 研究データ 治験データ 遺伝子データ 2 SASやRを使って統計解析について解説 「統計学を勉強するときに知っておきたい10ポイント」 ◦ h
CSS3だけでつくるWebボタン！押さずにはいられないボタン簡単3ステップ
インターンシップにきています。 こんにちわ。(・`д・ノ)ノ 面白法人カヤックでインターンシップ中のどうもぽんたです。 先週、鎌倉本社から自由が丘支社に移りました。 自由が丘に来たのは初めてなので、「丘ないなぁ。」って思いました。 そしてこちらはインターン研修で、書いているエントリーです。 どうか柔らかいまなざしで見守って下さいませ！ 今回は画像を使わず、CSS3だけでWebボタンをつくる方法を紹介したいと思います。 といっても僕自身つくったことがないので、一緒に挑戦しましょう！！ つづきからどうぞ！ すごいよ！CSS3 ≫ CSS3のみでつくっているボタンを紹介している凄いサイトがあります。 ラムネのようなテイストのボタンですな。 これを画像なしでつくってるっていうからスゴイ！ ここまでレベルの高いボタンはつくれないので、 基本重視のシンプルなCSSボタンをつくろうと思います。 まずはC
どう考えても無茶な「CSSプログラミング」が話題に
CSS3がいくらパワフルとはいえ、さすがにここまで凝ったものが作れるとは思いませんでした。 まずはChromeでこちらを遊んでみてください。 CSS3 OF THE DEAD - jsdo.it - share JavaScript, HTML5 and CSS まるでJSをバリバリ使ったゲーム、のように見えますが、実は「Only CSS」。上のSTOPボタンを押すとコードを確認することができます。 jsdo.itでCSSプログラミングが流行中！ ええ、どう考えても無茶なんです。CSSはプログラミング言語じゃないですからね。 CSSの機能を巧みに組み合わせて作成されています。 ということで、投稿作品のほんの一部を紹介したいと思います。 CSS PANIC CSSだけで作られたワニワニパニック。 このコードは海外のユーザーにも大きな反響を呼びました。
デザイナは要注目！ 明日から語れるHTML5＆CSS3（1/4）- ＠IT
デザイナは要注目！ 明日から語れるHTML5＆CSS3：一撃デザインの種明かし（13）（1/4 ページ） ※本稿では特に断りがない場合、Firefox、Google Chrome、Opera、Safariは2010年7月時点の最新バージョン、IEはInternet Explorer 6/7/8の総称です。 いま世界で一番熱い「HTML5」「CSS3」とは？ 最近、「HTML5」「CSS3」といった言葉をよく耳にしませんか？ これらはWebの表現をもっと豊かにするために策定中の言語です。いままでのHTML 4.01やXHTMLでは実現できなかったことができるようになったり、CSS3はCSS 2.1よりさらにグラフィカルな部分まで表現できるようになりました。 FirefoxやOpera、Safari、ChromeといったHTML5＋CSS3に対応するWebブラウザが増えてきたことで、HTML5
HTML5でWebページをマークアップするための基礎知識
最近よく目にする「HTML5」という言葉。JavaScriptのAPIやCSS3、SVGなどを含め、急速な広がりを見せつつある「HTML5」の基礎を学べる入門連載です。「HTML5を使うと、何ができるのか」「それを実現するには、どのようなプログラムを書いたらいいのか」をお届けします 5からHTMLの“文法”が変わるって知ってた？ 連載第1回の「Webの3つの問題を解決する「HTML5」とは何なのか」では、HTML5という技術革新の意義、そして本連載の大まかな流れについてお話ししました。連載第2回である今回は、HTML5のマークアップを行うための基礎知識についてお話しします。 HTML5では、その文法が大きく変化しました。「HTMLが、どれほど普及しているか」「根底となる“文法”が変わってしまったら、どれほどの影響があるか」に想像が及ぶ方であれば、非常な驚きと不安を抱かれるかもしれません。
「HTML5 Rocks」だけじゃない、ブラウザ各社のHTML5チュートリアルを集めました
Webブラウザを提供する主なベンダ、グーグル、マイクロソフト、モジラ、オペラ、アップルらは、HTML5への対応を急ぐと同時に、相次いでHTML5の魅力や内容をデベロッパー向けに紹介するサイトを開設しています。この記事では、それらをまとめて紹介することにしましょう。 グーグルの「HTML5 Rocks」 グーグルは6月22日に開発者向けにHTML5を紹介し、学習するためのWebサイト「HTML5 Rocks」をオープンしました。 HTML5 Rocksは現在3つのコーナーに分かれています。 1つ目は「Interactive Presentation」。これはHTML5の新たなAPI、DOM APIやLocal Storage、WebWorkerなどさまざまな機能を紹介するプレゼンテーション。機能と共にJavaScriptでのコーディング例や実際に動作するデモなどが用意されており、HTML5の
HTML5という言葉に圧倒され気味の方への、HTML5入門 | Ext Japan Blog
この記事は5/23に掲載された「A HTML5 Primer for the Overwhelmed」を訳したものです HTML5がグーグルやアップルにより、リッチインターネットアプリケーション（RIA）のためのソリューションとして強力にサポートされ始めた結果、HTML5という言葉がバスワード化しています（特にGoogle I/O以降）。そして、HTML5という言葉が広く流布するにしたがって、その言葉本来の意味とは違う意味で使われ始めていることも、驚きではなくなっています。「HTML5の経験があること」が採用条件となっているような採用情報も既に存在しますし、シンプルなJavaScriptアニメーションもCSS3によるアニメーションもひっくるめてHTML5のサンプルとして紹介されていたりします。 ちょうど00年代中頃に「次世代のWeb開発」を指すバズワードとして「AJAX」や「Web2.0」
いますぐ使えるCSS3テクニック集！ コピペ用サンプル付き！
面白法人カヤックがサイトリニューアル！ いきなり手前みそで恐縮ですが、今年の夏、面白法人カヤックがコーポレートサイトを2年ぶりにリニューアルしました。 「世界一更新頻度が高く、カヤックの活動がひと目で分かるコーポレートサイト」をコンセプトに、可読性が高く容量も軽いサイトに仕上げました。 ひと目見るだけで、最近のカヤックの動向が分かるようにニュースでTOPページを構成し、日々リアルタイムにカヤックの最新の情報を発信します。 技術的には、ブラウザのウィンドウサイズによって拡縮する画像はベクターファイルであるSVG（Scalable Vector Graphics）画像で置き換えたり（SVGはベクトル形式の画像のため、拡大してもボケない）、CSS3を用いることで画像の使用を極力控えたりするなど、ページの軽量化を実現しています。 カヤックサイトのCSSテクニックを丸ごと伝授！ 本稿では、サイトリニ
2130703450443574201?keyword=HTML5
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IBM Developer
JavaScript DOM リファレンス
見出しデザイン.com -Webデザインの“見出し”を集めたサイト-
あんじょうできてはる
I/O 3000
Webサイトをスマートフォン対応してと言われた時に見ておきたいサイトまとめ｜caraldo.net | WebとiPhoneとロードバイクが大好き！
データマイニング - Wikipedia
HTML5マークアップの心得と作法