タグ

JavaScriptとjavascriptに関するpaellaのブックマーク (66)

  • Webデザインやプログラミングなどの勉強に良さそうな国内のブログ記事やWebサイトいろいろ - かちびと.net

    この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 いよいよ2011年がスタートしました。 今年も去年同様、勉強することが 沢山あります。まだモチベーションが そこそこあるうちに勉強になりそうな 国内の記事をリンク集にしました。 迷ったときに見てみようかなと思い ます。 より最適な方法というのはあると思いますが、まずは扉を叩かない事には何が悪いかも分かりません。ということで、内容に拘らず、否の意見をスルーしてここに色々まとめさせて頂きました。 勉強したい気持ちはあるけど出来ない理由は「何を始めればいいのか分からない」という方も、何が出来るのか、どういった勉強法で出来るようになるかが分かればやる気が起きるかも知れません。 5分で分るシリーズ 以前も流行ったんですね。Web関連以外も含めてここにまとめられています。 5分

    Webデザインやプログラミングなどの勉強に良さそうな国内のブログ記事やWebサイトいろいろ - かちびと.net
  • 5分で分かる JavaScript を知らない人が JavaScript の便利さを学べる記事を書いたよ - ginpeiのブログ

    JavaScript を知らない人に JavaScript の話して欲しいと言われる夢を見たのでブログ書きました。*1 難しい話は抜きにして JavaScript は <script> と </script> で囲えば動きます。*2 HTML をコードレベルで編集できるサービスなら、設定は一切不要です。 <script> JavaScriptのコード </script> 拡張子にも制限はありません。最終的にHTML文書として出力されるのであれば、htmlでもphpでもcgiでも構いません。なおフレームの代わりにPHPを使うという為になる記事があるのですが、ここでは関係ないので読むのは後ででよいです。 ついでに JavaScript を少しでも使えるようになれば、こんなことができるという一例を紹介します。 コピーライトの西暦を自動更新 JavaScript を使えばページフッタの西暦も自動更

    5分で分かる JavaScript を知らない人が JavaScript の便利さを学べる記事を書いたよ - ginpeiのブログ
  • まだまだ間に合うCanvasでアニメーション入門(まとめと実践) :: 5509

    JavaScript Advent Calendar 2010も22日目!あと3日ですよ。僕はちょうど学んだばかりのCanvasをアウトプットもかねて、まとめと実践を書いてみます。知ることと行うことは同一である、最近行ったセミナーでも言ってました。 jsdo.itにはほんまにこれCanvasなん?なサンプルいっぱいありますね。あーいうの書けるようになりたいなぁとか思いつつ、jQueryばっかりさわってた僕は.animate()メソッドの便利さに取り憑かれていたので、Canvasの絵もまだ上下左右で動かすくらいしかできません。慣れが必要です。。 どうでもいい情報としてCanvasの読み方なんですけど、「キャンバス」じゃなくて「カンバス」が正しいようです。キャンバス・カンバスどっちでもよさげ。僕はキャンバスって読んでました。けどカンバスにします。 前置きはこれくらいにして、今回は次のようなカラ

  • iOS向けゲームが15分で開発できる、高速HTML5ゲームエンジン「IMPACT」登場 【増田(@maskin)真樹】 | TechWave(テックウェーブ)

    [読了時間:1分] 先日、リリース間近とお伝えしたHTML5ゲームエンジン「IMPACT」が12月21日未明、正式に公開となった。同エンジンで開発されたゲームは、iOS上では60フレーム/秒を実現するとされており、HTML5対応のウェブブラウザであればプラグインなどをインストールする必要なく実行できるという特徴を持つ。サイトには、効率の良い開発スタイルを説明するビデオやサンプルソースコードなどが公開されている。ライセンスは価格は99ドル。 エンジンを開発した独Dominic Szablewski氏は、HTML5に対応したモダンブラウザ上で高速に動作するゲーム「Biolab Disaster」を公開、その開発のために使用したエンジンを一般に提供すると告知していた。今回の正式リリースで、このゲームもアップグレード。公言通り、iOS上でも快適に動作するようになっている。 lMPACTは、HTML

    iOS向けゲームが15分で開発できる、高速HTML5ゲームエンジン「IMPACT」登場 【増田(@maskin)真樹】 | TechWave(テックウェーブ)
    paella
    paella 2010/12/21
    Titaniumとは方向が違うけれど、方向が同じ、と。
  • コピペで使える言語・コマンドリファレンス - ITproリファレンス:ITpro

    HTMLCSS、DynamicHTMLJavaScriptPerlWindowsコマンド、ネットワークコマンド、Linuxコマンドといった、Webサイト構築やアプリ開発に欠かせないプログラミング言語とコマンドのリファレンスマニュアルです。各項目のサンプルコードは、コピーし貼り付けてすぐに使えます。入門講座も用意しました。ぜひブックマークしてお役立てください。 HTML HTMLは、Webコンテンツを作成する上で、最も基礎となる記述言語です。各タグについての概要や属性などをサンプルを交えて説明します。 HTMLリファレンス(107項目) HTMLリファレンスの使い方 HTML入門 CSS CSSは、Webページのレイアウトなどといったコンテンツの見栄えを指定する記述言語です。各スタイルの概要や使い方を説明します。 CSSリファレンス(73項目) CSSリファレンスの使い方 CSSの基

    コピペで使える言語・コマンドリファレンス - ITproリファレンス:ITpro
    paella
    paella 2010/12/17
    コピペで使える言語・コマンドリファレンスとのこと。どこまで信用していいものかどうかはさておき、とりあえず。
  • TwitterのステータスIDが53bitを越えたお話 - tmytのらくがき

    僕の記事の間違いを指摘していただいているすばらしい記事です。僕の記事よりこちらの記事をご覧ください。 http://archive.guma.jp/2010/12/twitter-json.html 先日、29日の7時過ぎごろにTwitterのステータスIDが53bitを越えました。 こんな中途半端なビット数を超えただけでなぜこんな記事にするかというと、一部のクライアントで動作がおかしくなることがあるからです。 (14:14 追記しました) (14:31 もひとつ追記しました) TwitterAPIはXMLとJSONの2種類で結果を取得できます。このうちXMLで処理してる場合は内部で64bit INTで処理していれば特に問題は起きません。 問題が起きるのはJSONの場合です。JSONはJavascriptでevalすればそのまま中身が取り出せることからもわかるように、Javascript

    TwitterのステータスIDが53bitを越えたお話 - tmytのらくがき
    paella
    paella 2010/12/01
    Javascriptの数値型は64bit浮動小数点数==52bitの仮数部。idを文字列としてパースした後、long型などの64bit整数へ変換するのが吉、と。
  • Titanium MobileでiPhoneアプリを開発、リリースしました

    * 2010/11/17 17:00追記 foursquareで誰もチェックインしない会社のMayerになってニヤニヤしている小山です。 最近、個人的にですが、`CacooViewer’というiPhoneアプリをリリースしました。 CacooViewer CacooViewerは、弊社と同じ福岡に社を置くヌーラボさんの`Cacoo‘というリアルタイムなコラボレーションが可能なWebドローイングーサービスのモバイルビューワです。 CacooViewerは非常に簡単なアプリですが、Flashで作成されているCacooの「iPhoneiPadで作成した画像を見れない」という弱点を若干ながら補完するアプリになっています。 で、 実はこのアプリ、Titanim Mobileを利用して作られています。 Titanium Mobileって何? Titanium Mobileとは、大雑把に言うと「Ja

    Titanium MobileでiPhoneアプリを開発、リリースしました
  • 【Webアプリ】iPhone4 で画像をきれいに表示するもう一つの方法【mod_rewrite】 - nazokingのブログ

    iPhone4は解像度が高いので、画像を切り替えないと、もやっとする。 【Webアプリ】iPhone4 で画像をきれいに表示する色々な方法【試行錯誤編】 | KAYAC DESIGNER'S BLOG - カヤックの意匠部によるデザインやマークアップの話 Retinaディスプレイに画像を最適化させるのって意外とめんどいよね! という現実に打ちのめされたので、まとめてみます。 によると ぜんぶ高解像度の画像にする → 3Gで表示が重いかも 画像を2種類つくって切り替える → 画像の数が多いとひとつひとつCSS指定するのが辛すぎる 画像はスケーラブルなデータ形式で用意する → 次に作るときはそうしよう…… 画像はそもそも使わないデザインにする → 次に作るときはそうしよう…… ということで決定打はなさそうな感じ。 でも、画像の切り替えって USER_AGENT 見て mod_rewrite で

    【Webアプリ】iPhone4 で画像をきれいに表示するもう一つの方法【mod_rewrite】 - nazokingのブログ
    paella
    paella 2010/11/16
    window.devicePixelRatioとmod_rewriteを使って、普通のアプリの時の@2xライクな画像選別を行えるようにする方法。ふーん、そうやるのか。
  • iPhone 4 の CSS を切り替える方法

    携帯電話 (Nokia, Sonye Eicsson, iPhone) やMac、写真、吉田カバン、スマートフォンサイト制作 (HTML5, CSS3) などについてのブログ iPhone 4とiPhone 3G/3GSとで、スタイルシートを切り換える方法を考えてみました。 iPhone 4のディスプレイ解像度は従来機と比べて縦横それぞれ2倍になりましたが、iPhone 4のSafariではviewportを従来どおり「width=device-width」と指定しても、320×480ピクセルの画面を2倍に拡大して表示されるため、ディスプレイ解像度の違いを考慮しなくても、従来と同様に表示できます。 しかし、これでは画像にジャギーが発生してしまうので、iPhone 4を区別できないかと色々探っていたところ、JavaScript(DOM?)に「window.devicePixelRatio」と

    iPhone 4 の CSS を切り替える方法
    paella
    paella 2010/11/16
    window.devicePixelRatioが、RetinaDisplayとそうでないので返す値が違うとのこと。ふむふむ。まずは見分け方。
  • GameBoy Emulation in JavaScript: The CPU

    This is part 1 of an article series on emulation development in JavaScript; ten parts are currently available, and others are expected to follow. Part 1: The CPU Part 2: Memory Part 3: GPU Timings Part 4: Graphics Part 5: Integration Part 6: Input Part 7: Sprites Part 8: Interrupts Part 9: Memory Banking Part 10: Timers The emulator described in this series is available in source form: https://git

    GameBoy Emulation in JavaScript: The CPU
  • iPhoneアプリの引っ張るアクションを再現するJavaScript·iscroll-js MOONGIFT

    iscroll-jsはコンテンツを引く動作をMobile Safariであってもネイティブアプリに近い動作にする。 MOONGIFTはこう見る 様々なライブラリ、ソフトウェアによってネイティブアプリとWebアプリの境が低くなっている。これはiPhoneに限らず、PCでも同様だ。だが、HTML5を積極的に使えたり、ネットワークがすぐに使えたりとスマートフォンの方がより実用的になっている。 iscroll-jsのようなライブラリが増えていけばさらにネイティブアプリからWebアプリを押し進める流れができてくるはずだ。この動きには今後注目しなければならない。 [/s2If] iscroll-jsはJavaScript製のオープンソース・ソフトウェア。iPhoneアプリで人気のある機能の一つで、リストを引っ張って離すとデータ更新を行うというものがある。同様のアクションをiPhone最適化サイトでも提

    paella
    paella 2010/11/12
    UIScrollviewのマイナス位置に置いたビューのように、スライドすると出てくるUI
  • Web WorkersでPhotoshop風ヒストグラムを作ろう (1/4)

    JavaScriptで並列処理を実現する「Web Workers」。前回はWeb Workersの基的な使い方を学び、バイナリデータを解析するプログラムを作りました。今回は、Photoshopのヒストグラムのように、RGB(赤、緑、青)の輝度のピクセル数を調べる画像解析プログラムを作りましょう。画像処理は時間がかかることが多いので、Web Workersを利用するにはもってこいです。 まず、調べたい輝度と画像データを以下のようにワーカーに渡します。 myWorker.postMessage({ width: canvasW,      //キャンバスの横幅 height: canvasH,        //キャンバスの縦幅 brightness: brightness,   // 調べたい輝度 imageData: context.getImageData(0, 0, canvasW,

    Web WorkersでPhotoshop風ヒストグラムを作ろう (1/4)
    paella
    paella 2010/10/20
    1つ前の回でJavascriptによるバイナリデータ取り扱いの方法があって、で、今回のヒストグラム作成 by WebWorkers。これは面白そうなのでメモメモ。
  • 画面レイアウトを行うときに便利なツール « Elegant Apps Developers

    こんにちは。BoltzEngine 担当の伊藤です。 Windows 10 の最新版、April 2018 Update (バージョン1803、ビルド17134.1) が配信されました。このアップデートで、Windows 10 の Microsoft Edge でもウェブプッシュが使えるようになりました。 これまで Chrome や Firefox を別途導入する必要がありましたが、標準の Edge だけでプッシュ通知が実現できるようになったので、今後より利用しやすくなりました。 こんにちは! 島根支社でウェブエンジニアをしているカナツです。 GW も終わり、現実と向き合う日々に引き戻されたみなさま、いかがお過ごしでしょうか。 次の大型連休は島根観光をオススメします。自然が豊かすぎる島根で非日常的な日々を過ごしたくないですか? 前置きはさておき、みなさん、チーム開発時のソースコード管理って

    paella
    paella 2010/10/15
    UITableViewControllerをエッセンスに分離し、肥大化やメンテナンス性の悪化を防ぐ方法の一考。参考になりました。
  • jQuery Essentials

    The document discusses jQuery and its uses and methods. It introduces jQuery as a way to write JavaScript code that works across browsers. It provides examples of how jQuery can be used to select and manipulate HTML elements using simpler syntax compared to vanilla JavaScript. Key jQuery methods are also summarized, including how to select elements, modify attributes, handle events, add/move eleme

    jQuery Essentials
    paella
    paella 2010/06/19
    jQueryの情報がおおよそ網羅してあるスライド。なかなか良いとのこと。
  • ページに動画を埋め込む際につい使ってしまいたくなるjQueryプラグイン「Video LightBox」:phpspot開発日誌

    ページに動画を埋め込む際につい使ってしまいたくなるjQueryプラグイン「Video LightBox」 2010年06月10日- Video LightBox - Embed video to your website with beautiful Lightbox effect! ページに動画を埋め込む際につい使ってしまいたくなるjQueryプラグイン「Video LightBox」。 名前から推測するに、単に動画をLightBox化しただけでしょう、と思いきやなかなか素晴らしいプラグインになっていたのでご紹介です。 動画のサムネイルを次のように様々なスキンによって修飾できます。クリックすればニュイーンとLightBox表示されるというオシャレさ加減がいいです。 更に埋込可能な動画形式が豊富で、flv, mp4, 3gp や、外部動画サイトのYoutube, Facebook, Goo

    paella
    paella 2010/06/10
    これは素敵。採用したい
  • JavaScriptで3D - os0x.blog

    id:wanparkさんが(3年前に)書かれたchannel3というFlash用3DグラフィックライブラリをJavaScriptにポーティングしてみました。IEは未対応です(たぶんそのうち)。 channel3JS - ss-o.net この前のCanvasでDot3Dが結構余裕だったので、もうちょっと格的な(だけどライブラリとして大きすぎないような)のをポートしたくなったところにchannel3のことを思い出して、突貫でやってみました(コメントアウトいっぱいでソースは綺麗じゃないです)。 SVGとCanvas両対応です。なぜかというとパフォーマンスを比べたかった(SVGのほうが良い)のと、テクスチャやるにはCanvasが必要になりそうだから。 実はSVGほぼ初めて触ったんですが、面白いので後でまとめようと思います。 ソースは os0x / channel3JS / source — B

    JavaScriptで3D - os0x.blog
    paella
    paella 2010/06/08
    ファンがブンブン鳴り出すね。
  • JQuery Narrative Select Plugin by gdakram

    JQuery Narrative Select Plugin by gdakram From If this is , then you are . Date: To If this is , then you are . Date: Why, When Make your drop-down list look uniform cross-platform. Enables you to include a drop-down list as part of a 'narrative' form, where your user input fields look uniform. How <!-- CSS --> <style type="text/css"> @import url("/path/to/jquery.narrativeselect/jquery.narrativese

    paella
    paella 2010/05/12
    選択肢を選ばせるときのフォームがオサレなjQueryサンプル。けっこう使いやすい。
  • UIWebViewのタップ&ホールドで表示される「アクション」ポップアップを抑制する - 24/7 twenty-four seven

    LDR touchのエントリー画面のように、UIWebViewを、ブラウザとしてではなく、HTMLのビューアとして使ってるような場合は、このポップアップはあまり意味が無いので、出したくないときがあります。 これは以下のようなスタイルを指定すれば、抑制できます。 -webkit-touch-callout: none; プログラムから抑制する場合は、JavaScriptを使って指定するといいです。 webViewDidFinishLoad:メソッドに書いておくと、ちょうどいいタイミングで実行されます。 - (void)webViewDidFinishLoad:(UIWebView *)webView { [webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.style.webkitTouchCal

    UIWebViewのタップ&ホールドで表示される「アクション」ポップアップを抑制する - 24/7 twenty-four seven
    paella
    paella 2010/04/20
    [webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.style.webkitTouchCallout = 'none';"]をwebViewDidFinishLoad:で書いておくと抑制できる。
  • Site Under Maintenance

    We'll be back soon! Our site is currently undergoing maintenance. Please check back later.

    Site Under Maintenance
    paella
    paella 2010/04/07
    あとで(必要になったときに)読む。
  • Big Sky :: JSONをvalidation出来る正規表現。

    追記 os0xさんにjson2.jsで使われている手法である事を教えてもらいました。 正しくはエスケープが必要。 以下フォーラムで議論されている内容から拝借 validating json unnecessarily is killing firefox - jQuery Forum // Try to use the native JSON parser first if (window.JSON && window.JSON.parse) { try { return window.JSON.parse( data ); } catch (err) { jQuery.error( "Invalid JSON: " + data ); } } else { if ( /^[\],:{}\s]*$/.test(data.replace(/\\(?:["\\\/bfnrt]|u[0-9a-f

    Big Sky :: JSONをvalidation出来る正規表現。
    paella
    paella 2010/03/24
    簡単な検証に使えるとのこと。自分でJSONを使って書く時のテストによさげ。