JSGraphsはデータ可視化の為のJSライブラリをまとめているWebサイトです。左カラムの各項目でライブラリをJquery依存のもの、無償利用可能なもの、SVGを使ったもの等に絞ることが可能です。SSにマウスホバーすれば該当のライブラリのプロジェクトサイト、ダウンロードページ、動作サンプルページへのリンクが表示される、というシンプルなもの。目的から探せて良いですね。 JSGraphs
2015-05-12 [翻訳]Issue 55 Front-end Dev Weekly Issue 55の元記事はこちら コメント 良いUI、UXの心理学、アクセシビリティのネガティブな集まりに打ち勝つこと 疑いなく、今週の記事の中で一番重要なのは全てのデザイナーがアクセシビリティについて知っておくべき7つのことです。SalesforceのUXチームのJesse Hauslerによって書かれた記事で、デジタルなインターフェースを「アクセシブル」にする際の間違いを正すことや、期待した通りにインターフェースを構築するためのまっすぐで簡単なガイドラインにおいてだけではなく、個人的又は技術的に制限があろうとなかろうと、そういったユーザーをブロックしない点において、印象的な役割を果たします。Jesse自身の発言で一番良いのは、「表面的には、コンポーネントの使い方によっては制限を配置することであると
iOS/Androidなど、モバイル向けのWebサイト、Webアプリ、ネイティブアプリでの利用に最適化されたタッチデバイス対応のスライダーを実装できるスクリプトを紹介します。 キーボード操作やマウスのホイール・ドラッグ操作にも対応しているので、デスクトップでもOK! Swiper Swiper -GitHub Swiperの特徴 Swiperのデモ Swiperの使い方 Swiperの特徴 ライブラリに依存しない Swiperは他のスクリプトのライブラリに依存せず、軽量で速く動作するスクリプトです。 jQuery, Zetro, jQuery Mibileなどの他のライブラリと一緒に使う時も安全です。 タッチの動きをそのまま デフォルトの設定でタッチの動きを「1:1」でインタラクションとして提供できます。 豊富なオプション ページネーション・ナビゲーションボタン・パララックスエフェクトなど
AgularJS に対する気持ち 所感といいつつ、主に自分がつらさとして感じていることを書く。所感シリーズとしては jQueryについての所感 も併せて読みたい。 この学習曲線の中でいうと、たぶん今の自分は Very Cool! の頂点から降りている最中くらいだと思う。そして、マサカリをふりかぶった諸兄にひとつだけ言いたいのは、共感脳を養った方がモテるということだ。 チキンハート的弁解: 以下はAngularJSに関するつらさを述べることに専念するために、美点を挙げていないだけであってAngularJSを全方位的に貶めたり、何かと比べて明確にクソだというような意図はない。 画像は AngularJS: The Best Parts · Anand Mani Sankar からの引用。X軸にある www.bennadel.com は AngularJS 大好きさん。 辛1. $scope が
対象読者 jQueryなどを使っているJavaScript開発者 JavaScriptを使った複数人でのプロジェクトに参加している方 JavaScriptを使ってサーバ等と連携したフロントエンドの開発をしている方 必要な環境 この記事では、AngularJSを使用し、Chrome(36.0)、IE11、Firefox(31.0)、Safari(7.0.5)の環境で確認を行っています。 サンプルアプリケーションの概要 今回作成するアプリケーションは、単純な「タスク管理」のアプリケーションです。次のような3つの画面を作ります。 タスク(件名とメモ)を登録する画面 登録したタスク一覧を表示する画面 登録したタスクを参照する画面と、削除する為の画面 ページ遷移はシングルページアプリケーション形式で作成します。シングルページアプリケーションとは、jQuery Mobileなどでも使われている方式であ
最近個人的に作った写真共有サイトを公開しました。 photoll - スポット写真共有サイト この写真共有サイトで実際に使っているおすすめGemを晒してみます。 あと、おまけで使ってないけど便利そうなGemとかも紹介。 一人で1からWebサービスを作る過程を書いた拙作のブログエントリもよかったら見てください。 【1人でWebサービス開発】新米Railsエンジニアが無謀にも写真共有サイトを作りました だいぶ長いですが、Gemfileをそのまんま載せました。簡易説明付き。 主要なGemをあとで説明します。 source 'https://rubygems.org' gem 'rails' gem 'mysql2' gem 'haml-rails' # HTMLを簡潔に書ける gem 'sass-rails' # CSSを効率的に書ける gem 'bootstrap-sass' # Twitte
作成:2013/12/24 更新:2014/11/01 Web制作 > サイト構築中にちょっとした動きをのせたいとき、どうすれば良かったのか何度も調べ直さないといけないことがあります。今回はJavaScript で初心者の方でもすぐ活用できるように、使用頻度の高いリファレンスと基本知識をまとめました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ できること 1.リファレンス スクリプトの書き方/基礎知識 2.スクリプトの記述 3.文字列/特殊文字 4.演算子 5.オブジェクト 6.プロトタイプ 7.イベント 8.変数 9.if文 10.配列 11.連想配列 12.正規表現 13.デバッグ できること 1.リファレンス JavaScriptは開発環境の準備がほぼ不要で、コピー&ペーストだけで、動くものができてしまいます。他の言語だとそう簡単にはいきません。サ
Chapter 02 3 ステップではじめるかんたん jQuery 入門 # Easing Chapter 04 確かな基礎力を養う jQuery の基本テクニック 01 さまざまなホバーエフェクトで学ぶ動きのある表現の基本 02 画像とキャプションの表現 03 丸いボタンのレイアウト 04 見え隠れするサイドバー 05 タイポグラフィの表現 # Chaper 04 完成版 Chapter 05 活用の幅を広げる jQuery の必修テクニック 01 なめらかな動きの スライドショー Basic 02 多機能なスライドショー Advanced 03 スティッキーヘッダー Basic 04 デザインが変化する スティッキーヘッダー Advanced 05 画面領域を有効活用できるタブ Basic 06 高機能で拡張しやすいタブ Advanced 07 スムーズスクロール Basic 08 拡
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
2013年11月05日10:36 JavaScript 勉強会 今、AngularJSというフレームワークがヤバい 先週の土曜日、ランサーズさんで行われた 第3弾 週末ランサーズ に参加して個人的に今アツい AngularJS について話してきました。 AngularJS は ng-repeat が便利だったり、コードの見通しが良くなるなどいろいろなメリットがあると思うのでうまく使えば大変メリットがあると思います。特に、データの状態(要素の追加・削除や、状態のon/off など)を制御すればそれに合わせて view の表示はすべて AngularJS がやってくれるというのは素晴らしいですね。 ちなみに、以下の資料の中で ng-app とか ng-repeat とか出てきますが(これは directive と呼ばれます)、この ng というのは AngularJS の2文字目と3文字目を表
はじめに はじめまして。プログラマ向け情報共有サイトQiitaを開発・運営しているIncrements株式会社の高橋と申します。Qiitaではフロントエンドのアプリケーション開発にBackboneを採用しています。また縁があってBackbone.jsガイドブックという本を執筆させていただきました。本連載では、Backboneを使ったより実践的な話題を紹介していきたいと思います。 初回となる今回は「すでにjQueryを使っているけど最近何かと話題のBackboneも気になる!」という開発者の方がBackboneを試しに使ってみる際の初めの一歩の踏み出し方を紹介することが目的です。そのために今回はjQueryで実装されたサンプルコードをBackboneに移植します。 なぜBackboneを使うの? すでにjQueryがあるのになんでわざわざBackboneを使うのでしょう。jQueryを使えば
jQuery.textcomplete(デモ) GitHubのようなtextareaの補完機能を実装する - カーソル位置の取得 を書いたのも今は昔、いつか続きを書こう書こうと思いながら気がつけば5ヶ月が過ぎました なんか続きを書くのが面倒くさくなったのと、某日本最大レシピ共有サイトの技術部長の人から「OSSにして欲しい」という要請を人伝に受け取ったこともあって、OSS化した次第です。 ライセンス MITライセンス 簡単な使い方 簡単に説明します。詳しくは README を読んでください。 まず jQuery.textcomplete は名前からも分かるように jQuery プラグインになっているので、別途 jQuery が必要です。 <script src="path/to/jquery.js"></script> <script src="path/to/jquery.textcomp
初心者向けの本とかだと、イベントを jQuery オブジェクトの後に直接指定する、 $('.foo').click(); のような書き方で説明されている場合が多いけど、少し複雑なことをしようとするとそれだと困ることが出てきます。そんなときに便利なのが on() を使ったイベント設定です。 on() ひとつで bind() live() delegate() を表せる jQuery 1.7 で、bind() live() delegate() がすべて on() に統合されたそうです。 つまり on() の書き方によって、3 パターンの使い方ができるということです。 .foo という要素をクリックしたら何かするという例で、イベントの設定と削除の方法をそれぞれ書いてみます。 bind() $('.foo').bind('click', function(){...}); は $('.foo')
外部サイトのJSファイルを読み込むときに、こういう書き方するのはやめましょう。 <script src="http://example.com/js/jquery.js"></script> 理由 あなたのサイトが、いつの日かSSLに対応することになったとき、そのscriptタグがバグの原因になります。 ご覧のとおり、HTTPSページの中でHTTP要素を読み込もうとすると、ブラウザによっては安全装置が働いて読み込んでくれないのです。 上の例ではjQueryの読み込みに失敗していますが、エラーメッセージ「Uncaught ReferenceError: jQuery is not defined 」を見てもHTTPS/HTTPのプロトコルが原因だとはすぐ気づかないので、わかりにくいバグになってしまいます。 結論 JSファイル(とかCSSとか画像とか)を読み込むときは、"http:"の部分を省
ちょっと jQuery と簡単なサーバサイドの処理を組み合わせた処理を試しに書いてみよう・・・なんて時に、いちいち jQuery を取ってきて HTML を書いて script タグを書いてロードして sinatra 立ち上げて云々・・・というのが毎度面倒なので、ひな形になるアプリケーションを作った。 https://github.com/naoya/boilerplate ひとまず sinatra でサーバーサイドを書き、HTML は slim で、CSS は sass 。JavaScript は CoffeeScriptで書くにあたって jQuery、underscore、Backbone をロードしてある、というような構成にしてあります。 まあ、この類のことは人それぞれ自分なりにカスタマイズしてやっていると思いますが、どういうコンポーネントで構成しているかを、備忘録も兼ねてちょっと紹
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く