kanazawa.js v1.7 - Back to Basics -（2012年3月31日開催）で使用したスライドです。

“HTML5アプリ作ろうぜ！”連載がスタートしました！ デジタルハリウッドの現役アプリクリクリエイター専攻講師が、最近はやりの「HTML5・JavaScriptライブラリ・CSS3・API」の紹介、またそれらを組み合わせた「sampleアプリケーションの紹介と解説」を厳選し執筆していきます。 最近、セミナーでこの「impress.js」を利用する機会が多いのですが、その際に参加者から評判が良いので、まずはこれを紹介します。 impress.jsとは？ CSS3を活用したオープンソース（ライセンスMIT）のプレゼンテーションJavaScriptライブラリです。 対象ブラウザ Safariブラウザが現状では最もスムーズに動作します。一応、Chromeも推奨ブラウザです。 特徴 【1】ド派手なスライド動作 最大の特徴は派手でイケイケなスライド。始めてみた人は必ず見入ること間違いありません。シンプ

jQueryでスクロールすると表示する系いろいろ 最近はスクロールするときにいろいろ仕掛けをするのが流行なようです。 ここではシンプルにある要素の位置とか最下部までスクロールしたら何か表示するということをやってみます。 投稿日2012年03月08日 更新日2019年12月19日 ちょっとスクロールするとフェードして「トップへ戻るボタン」を表示を表示します。 ボタンは下の方にこんな感じで配置します。 html <p id="page-top"><a href="#wrap">PAGE TOP</a></p> fixedにすると固定配置されます。 css #page-top { position: fixed; bottom: 20px; right: 20px; font-size: 77%; } #page-top a { background: #666; text-decoration

最近nodejsで遊んでるのですが、nodejs単体だと面倒な事も多いのでライブラリを色々調べてみました。今回はそのまとめです。 よく見るもの 世間でよく使われてそうで、基本的なものを並べてみます。 node-dev スクリプトが更新されたら、自動的に再起動してくれるライブラリです。 node-inspector chromeとかをnodejsのデバッガとして利用可能にするライブラリです。 express 世間でよく見るフレームワークです。便利。Webやるなら必須な印象です。 socket.io websocketで遊ぶならこれです。。 connect expressも利用しているWebフレームワーク。サーバとか作る機能があるみたいです。 コールバックを何とかする系 nodeはシングルスレッドにもかかわらずマルチスレッドで動作しているかのように見せるため、逐次処理しようとしても想定と違う動

Instagramは日本のユーザーも多く、日常を切り取った写真がほとんどで、 またお洒落なものも混じっているのでたまに眺めると気持ちがホッコリしたりします。 特定のキーワードでInstagramの最新の写真を検索したい時があります。 例えば、みんなが今どんな「ご飯」を食べているのか、今日の「日の出」はどのような具合なのか、 がInstagramの写真を通して分かるかもしれません。 Instagramの写真検索サービスを探してみると、 Instagram自身が検索機能を提供してないので他の第三者が作ったサービスがいくつか出てきます。 使ってみたところ、もう少し自分で見た目やら機能を変えてみたいなーなんて思いました。 そこで、「Instagramの今の写真を検索できるサービス」といういわばWebサービスを作りたい欲求にかられます。 今回はこのようなちょっとした欲求から考えた「Webサービスのモ

jQueryでスクロールすると上部に固定されるナビゲーション グローバルナビゲーションはロゴの下に配置されていることが多いですが、スクロールするとナビゲーション部分だけが上部に固定されるようなものをjQueryでやってみたいと思います。 投稿日2012年02月21日 更新日2012年05月10日 html & css htmlです。 html <h1><a href="#">タイトル</a></h1> <div class="nav"> <ul class="clearfix"> <li><a href="#">HOME</a></li> <li><a href="#">ABOUT</a></li> <li><a href="#">NEWS</a></li> <li><a href="#">LINK</a></li> </ul> <!-- /#nav --></div> <div id="

Developers Summit 2012 で使用したスライド 後半を抜き出し少し更新したものはこちら: http://www.slideshare.net/dynamis/kanazawajsnext

2012/02/14 に発表した Titanium Mobile を使って開発している Zaim で得たノウハウたちです。

HTMLで複数の画像を読み込むとき、HTMLのimgタグだけだと不恰好となりがちですが、読み込みを管理すれば見栄えも整いますというデモとJSライブラリを作ってみました。次の2つのデモを見比べて何が違うのか確認ください。 デモ (通常のimgタグ) デモ (LoadManager.jsを使用) デモの違いとは 前者は画像がバラバラとインターレース的に読み込まれ、後者は読み込み終わるまでローディングが表示され読み込まれたものがフェードインして表示されます。 ▼前者のデモ ▼後者のデモ 後者のデモには、ローディングのパーセンテージ表示も付いています。読み込みが何%まで達しているかを確認できるのも、後述のJSライブラリのメリットです。 HTML5で作られたフルFlash的なサイトを見たときにimgタグでインターレース的に画像がバラバラとでてくることが多くて、いつも微妙な思いをしていました。Flas

池田 泰延 @clockmaker WebGLで一躍有名になったJavaScriptライブラリのThree.jsですが、大文字の名前空間に違和感が…。クラス呼び出すときに、 new THREE.Object3D() って見栄えはもちろんのこと、タイピングも面倒だし、書き忘れが多発しそうです。#javascript 2012-02-12 00:00:52 池田 泰延 @clockmaker JSで、もし jp.clockmaker.data.MojaData クラスを作った場合、いつも new jp.clockmaker.data.MojaData() って書くのでしょうか？場合によってはローカル変数に名前空間を入れればすみますが。。 #javascript 2012-02-12 00:08:13

サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?