SVG Drawing Animation | Demo 3
SVG Drawing Animation Path animation with sequential website fade-in Lorem Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed d
イラレ作成からWeb書き出しまで
SVG（Scalable Vector Graphics）とは、1998年に誕生した、ベクターイメージフォーマットです。これまであまり利用されている、ケースは少なかったのですが、Internet Explorer 9を含む、主要モダンブラウザが、SVGファイルに対応したのをきっかけに、ユニークなデザインを再現するのに、利用されはじめています。 海外デザインブログVectortuts+で、Illustratorをつかい、SVGファイルをWeb用に書き出す方法をまとめたエントリー「SVG Files : From Illustrator to the Web」が公開されていたので、今回はご紹介します。 詳細は以下から。 なぜSVGファイルは便利？ SVGフォーマットは、W3C（World Wide Web Consortium）によって開発、メンテナンスされています。特にさまざまスクリーンサイ
JavaScriptでオブジェクトの配列を filter() を使ってフィルタリングする | Try Lifelog
JavaScriptでオブジェクトの配列(普通の配列でもOK)に対し、あるプロパティの値をキーとして、条件を満たす要素のみを抽出したいときは、array.filter() メソッドを使う。(ソートしたい場合は、ここを参照。) 例えば、以下のような配列があるとする。 // JavaScript gLines = [ { ln_file: "T1301451.json" ln_key: "1301451" ln_name: "[ＪＲ]岩泉線 (茂市～岩泉) " }, { ln_file: "T1301541.json" ln_key: "1301541" ln_name: "[ＪＲ]北上線 (北上～横手) " }, { ln_file: "T1301671.json" ln_key: "1301671" ln_name: "[ＪＲ]磐越東線(ゆうゆうあぶくまライン) (いわき～郡山) " }]
flexibleSearch.js - ページ送りに対応した高速 Ajax 検索が可能な jQuery プラグイン | かたつむりくんのWWW
flexibleSearch.js とは flexibleSearch.js とは、あらかじめ作成しておいた JSON ファイルを検索することにより、柔軟で高速な Ajax 検索を実現する jQuery プラグインです。 ページ送りや検索項目の絞り込みなどにも対応しています。 また、ページ送りについては、hashchange.js を併せて使うことで、ブラウザの「戻る」「進む」の動作にも対応しています。 検索用 JSON の準備 flexibleSearch.js は、あらかじめ用意された JSON ファイルを読み込み、その内容を検索する仕組みです。 当プラグインで利用する JSON の形式は次のようになります。 {"item":[ { "key1":"値1", "key2":"値2", "key3":"値3" }, ...（略）... { "key1":"値1", "key2":"値2"
JS ArrayのforEach, filter, map の速度を調べてみた。 - webとかmacとかやってみようか R
最近のモダンブラウザのJS実装には、Array#forEach や filter, map などがビルトインされている。 jQuery とかの each使うより、ネイティブ実装のほうが早そう。しかし forEach、filter、map の速度に違いがあるのかちょと気になったので実験してみた。 環境は Mac OS X 10.7.4, MacBook Air（Late 2010） 2012/06/22 追記: −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− Sencha Touch, iPad等を追加しました → JavaScript の Array.forEach vs jQuery.each vs Ext.each −−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
[JavaScript] Array.indexOf()メソッドは遅い : iPhoneアプリ開発メモ
2013年05月01日12:01 by idyn [JavaScript] Array.indexOf()メソッドは遅い カテゴリJavaScript調査 ツイート 1. 導入JavaScriptのArray.indexOf()メソッドは、配列中である値が出現する位置が何番目かを、ループを書かずに調べることができる大変便利なメソッドで、私自身、一途にこのメソッドばかり使っていたのですが、先日以下の2つの問題に気づいてしまいました。 比較的最近追加されたメソッドで、IE8以前では対応していないforループで探すより3倍程度遅い1つ目の問題は、Mozilla Developer Networkのリファレンスに含まれるArray.indexOfの項目に対処法が書いてありますので、そちらを参照していただくとして、このエントリーでは2つ目の問題について調査を行います。また、Array.indexOf
WordPress の管理画面にオリジナルの設定ページを追加する方法
SaCSS の告知用にバナーを追加しようとした時に、毎回ソースコードを変更するよりも、管理画面で簡易的に設定できるようにするのがいいかなと思い、オリジナルの設定を追加する方法を調べてみました。 オリジナルの設定メニューを追加まずは管理画面のメニューにオリジナルの項目を追加する方法から。 Administration Menus « WordPress Codex 管理画面のメニューを追加するにはメニューを作るコードを含んだ関数を作り、 admin_menu にフックさせます。 今回自分は簡易的に使えるページを作りたかっただけなので、functions.php に追加しました。 functions.php add_action('admin_menu', 'banner_menu'); function banner_menu() { add_options_page('バナー管理', 'バ
[Pan] パン | その場で読める EPUB 電子書籍の共有プラットフォーム
『パン』はブラウザで読める電子書籍の公開サービスです。当サイトに掲載している電子書籍は、サイト上で閲覧できるほか、埋め込みコードを使ってあなたの好きなウェブサイトに埋め込み表示することができます。特別なアプリケーションやプラグインも必要ありません。 電子書籍をより簡単に発信できるようサポートし、より多くの人に作品を届けることを目指しています。 お問い合わせ パンは現在ベータ版として提供しており、正式なものではありません。今後サービス内容が大きく変更される可能性もあります。パンへ本の試し読み等の掲載をご希望の方は、そのことを踏まえた上でフォームからお問い合わせください。確認後、弊社よりご連絡差し上げます。また、パンへの掲載にはEPUBのご用意が必要になります。縦書の本や、凝ったレイアウトのEPUB制作なども別途お引き受けしています。 問い合わせる
[iOS 10] 必見！iOS 10時代のiPhoneアプリ開発見積もりの10個のポイント | DevelopersIO
ご覧のとおり、9月16日に発売される、iPhone 7と7 Plusを入れると、iOS 10に対応している10端末になります。iPhone 4sが対応外になりましたが、結局端末の種類とOSのバージョンの組み合わせで組み合わせはかなり増えてしまうので、開発を行う場合の保証する端末を明確に決めておく必要があります。全部のテストを全パターンやっているとキリがないので、ある程度網羅できる端末とOSの組み合わせのパターンで見積もりを行う必要があります。 何を気をつけておくべきか 新しい端末は対応必須なので、まずは、古い端末を何処まで対応するのか？を明確に決めておく必要があります。「対応しておくと良い」と言うのは、「対応しなくても問題ない」という意味にもなります。どこまで網羅して開発しなければならないのかという開発者の負担にもなりますし、テストの工数も増えますので、必要ない端末は、見積時に見切っておく
![[iOS 10] 必見！iOS 10時代のiPhoneアプリ開発見積もりの10個のポイント | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/cf4a0dd376b0a2fd49b646cbe9847ff1d8b2f9b0/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2016%2F09%2Fios10_400x400.png)
[iOS 10] iOS端末一覧（2016/9） | DevelopersIO
まとめ 開発サイドとして今回注目したいところは、最新端末のiPhone 7系統にFeliCaチップが搭載されたことと、2011年に発売され3.5インチ端末でありながらも最新OSに対応し続けてきたiPhone4Sが、遂にiOS 9系で打ち止めになったことでしょう。日本初上陸となるApple Payですが、世界的に見ても日本におけるiOS端末のシェア率は高く、またSuicaやPasmoなどのFeliCaに準拠した電子マネーサービスのインフラは整備されていることから、諸外国に比べても浸透は早いのではないかと思います。近い日、コンビニや公共交通機関で「iPhoneでタッチ＆ゴー」している姿が見られるでしょう。楽しみですね。
Agile Project Management
Proven project management for successful teams With a shared view of team priorities, a process that fosters collaboration, and dynamic tools to analyze progress, your team will deliver more frequently and consistently. Better organization to get focused Keep your team on the rails. Tracker's shared backlog makes priorities clear so the team can stay organized. Easily visualize scope, focus your t
Project management, collaboration, and task software: Basecamp
Refreshingly simple project management. Basecamp’s the project management platform that helps small teams move faster and make more progress than they ever thought possible. Try it for free, enjoy work more Got a process to track? Need to watch stuff move through stages? Basecamp’s Card Table is what you need. It’s our unique take on kanban.
Lighthouse - Beautifully Simple Issue Tracking
Collaborate effortlessly on projects. Whether you’re a team of 5 or studio of 50, Lighthouse will help you keep track of your project development with ease. Less Fuss, More Function Cut the fat out of your workflow and stay focused on what’s important. Lighthouse will simplify your workflow so you can do the job you were hired to do. Try it for free. No credit card required. Try Lighthouse For Fre
この1年、Webのパフォーマンスで変わったことは？──HTML5 Conference 2016
この1年、Webのパフォーマンスで変わったことは？──HTML5 Conference 2016 川田寛（ピクシブ株式会社） こんにちは、ふろしきです。HTML5 Conference 2016の当日は、38度近くの熱があり、発表時はろれつが回ってませんでした。しかし、伝えたいことは伝えられたと思っています。その内容とは… 「この1年でWebのパフォーマンスの技術にどんな動きがあったのか」 というダイジェスト。ここで話した3つのテーマについて、本記事でもご紹介。 1. レイアウト処理を減らす HTML5がバスワードするよりもずっと前から、CSSでアニメーションさせることはごくごくあたりまえ。JSが扱えないデザイナーであっても手軽にアニメーションできる良い世界になりました。しかしそこに、モバイルが出現したことで、JSだけで満足という人たちもCSSの機能を活用しなくてはいけなくなりました。 モ
モバイルWebのUIを速くする基本テクニックがわかる──Google I/O 2016 High Performance Web UI
モバイルWebのUIを速くする基本テクニックがわかる──Google I/O 2016 High Performance Web UI 川田寛（ピクシブ株式会社） こんにちは、ふろしきです！ 私はHTML5 Experts.jpで、過去2年ほどGoogle I/Oの情報を発信し、Web技術の変化についてお伝えしてきました。振り返るとGoogleは、2014年にモバイルWebの提唱と技術要素の拡大を図り、2015年からは「RAIL（モバイルWebが目指すべきパフォーマンス指標）」や「Progressive Web Apps（アプリのように振る舞うWeb）」といった、モバイルとの親和性が高いWebを作り出すための”考え方”を推し進めました。今年2016年は、さらにそれを踏み込んでいったという感じがします。 今回のI/Oで取り上げるのもそのひとつ。毎度お馴染みGoogle Developer A
Web制作にGPU処理を取り入れる
Updated 2013.10.24 / Published 2013.10.24 HexGLのようなWebGLのコンテンツを見ていると、これから本格的にWebがゲーム機の領域を浸食するようになっていくのかと、同じWebでもWebサイトを作る領域からすると動きの面で感心させられることしきりです。 なぜWebGLのアニメーションは滑らかなのか さておき、WebGLのコンテンツは非常に滑らかなアニメーションを実現できているわけですが、それはWebGLがCPUではなくGPUで処理されいるからとのことです。この場合のGPUで処理をするというのはソフトウェアであるブラウザがGPUを使ったハードウェア・アクセラレーションに対応していることが条件になります。つまり、CPU上でソフトウェア（ブラウザ）が処理する部分とGPU上のハードウェアで処理する部分を切り分けられる機能をもっているということになります。
HTML5 Experts.jpはなぜこんなにパフォーマンスが悪いのか…全てお見せします！ーWebパフォーマンス改善企画（解析編）
ちなみに後日談…計測対象の個別記事ですが、計測のためのアクセスがかなりの頻度あるため、PVランキングでは常に1位を独占していました（笑）。また、Google Analyticsについても、計測開始前に除外設定しておかないと、正確なデータが得られなくなりますので、ご注意下さい。 計測して問題点を洗い出す ファーストバイトダウンロードタイムの遅延問題 ということで、竹洞さんに一定期間サイトのパフォーマンスデータを計測してもらいました。その結果を見ながら、早速現在のHTML5 Experts.jpの問題点を洗い出します。 竹洞：これがある日の、ブロードバンド回線でChromeを用いてアクセスした時の計測結果です。 見ての通り、ID1のhtmlの取得にすごく時間がかかっていることがわかります。この水色は、ファーストバイトダウンロードタイム（Time To First Byte、以下、TTFB）とい
A6_F131C - Google 検索
A6_F131C に一致する情報は見つかりませんでした。 検索のヒント: キーワードに誤字・脱字がないか確認します。 別のキーワードを試してみます。 もっと一般的なキーワードに変えてみます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Porto Admin - Responsive HTML5 Template
perfect-scrollbar