覚えておきたいDevToolsのコマンドラインAPIまとめ - Qiita
DevTools、使ってますか？ もはやChromeじゃないと開発できないくらいに飼い慣らされています。 ブレークポイントやconsole.logなど基本的な使い方から、TimelineとAuditsを使ってのパフォーマンス計測などなど、DevToolsのポテンシャルは計り知れません。 個人的にはConsole APIが好きなんですが、今回はConsoleパネルで使える Command Line API の使い方についてまとめてみました。 $_ $_には最後に評価した式の結果が保存されています。 Console上で計算を行なった場合や、$セレクタなどでDOMを検索した結果など、最後の結果が常に保存されます。 $0 〜 $4 $0から$4にはElementsパネルで選択した要素が5つ保存されています。$0が最後に選択した要素で数字が増えるごとに過去に選択した要素になります。 $0は特に使いや
[JS]納品前の確認に最適、使用されていないCSSのセレクタを見つけ出すスクリプト -Helium
ウェブサイトの多数のページ全体に渡り、スタイルシートで定義されたセレクタが使用されているかどうかチェックし、使われていないセレクタのレポートを生成するスクリプトを紹介します。 納品する際に、不要なセレクタを除去するのに役立ちますよ。 Helium -GitHub Heliumの準備 Heliumの使用方法 Heliumの準備 HeliumはjQueryなど他のスクリプトを必要せず動作し、URLのリストから全てのページをロードし、解析して、スタイルシートで見つけたセレクタが全ページで使用されているかどうかチェックし、レポートを作成します。 スクリプトは、開発環境で実行してください。 公開中のサイトで実行すると、ユーザーにもHeliumの動作が見えてしまいます。 Step 1: 外部ファイル テストするページの全てに、当スクリプトを外部ファイルとして記述します。 場所は、head内でも</bo
Gmailチームが明かすHTMLアプリケーション起動の高速化テクニック TechTalkManiacs
などという煽り気味なタイトルをついつけてしまいたくなる記事がGoogleCodeBlogに掲載されていました。 最初のほうはごく普通にJavaScriptを使ったRIAアプリケーションはどうしても起動が遅くなるため、それをどう減らすか、というテーマにそって書かれています。 方法として挙げられているのは、最初にすべてを読み込まず、モジュール単位で分割して遅延ローディングすること。ただし、それだけだと回線速度が遅く不安定なモバイル環境では問題が生じるためHTML5のキャッシュ機能を利用するといいとのこと。 遅延ローディングのためのさまざまな手法の得失や、例えばユーザーデータを読み込むときには動的ロードしない、というようにユーザーの操作を妨害しないよう留意することなどについても述べられていてそれだけでもノウハウとして十分に有意義なのですが、決め手として最後に出てくる方法がすごいです。 その方法と
RedLine Magazine : スペースは嫌、class付けるのも嫌な時用(追記有)
スペースは嫌、class付けるのも嫌な時用(追記有) >>081210：追記 コメント欄にてもっといい書き方教えて頂きました！ タイトル、なんのこっちゃ？って感じなんですが、そういう時があるんです。例えば会社概要なんかをマークアップした時、定義リストとして書く際にdtに社名、所在地、電話番号・・・って入れるじゃないですか。そういう部分の元原稿って「社 名」みたいな感じで２文字の部分に予めスペースが入ってて見た目を整えてあるものが多いんですね。なんちゃって均等割り付けみたいな感じ。 ところがwebの場合、そういうのってhtmlに直接スペース入れられないじゃないですか。アクセシビリティ的にも文書的にも。もちろんデザイナ目線でのその部分の見た目を整えたい気持ちも分かるんですね。なのでCSSのletter-spacingで左右揃ってなくてもとりあえずなんとなく全部間隔あけとくか、チマチマと例外部分
jQueryのプラグイン100選 -2008年総集編 | コリス
seekAttention 注目箇所だけハイライトのアニメーションで強調。 スクロール・ドラッグなど操作関連のjQueryのプラグイン
[メモ]SWFUpload | Ryuzee.com
SWFUploadはオープンソースのファイルアップロード用ライブラリでJavaScriptとFlashで実装されている。 主な特徴は CtrlやShiftキーを使って一度に複数ファイルを選択しアップロードできる 全てのイベントでJavaScriptのコールバックが可能 アップロード開始前にファイルの情報の取得が可能 アップロードの部品もCSSで加工してある ファイルやアップロード状況をhtml上で表示 ページのリロードが不要 Flashをサポートしているプラットフォームならどんなブラウザでも動作 FlashかJavaScriptが使えない場合は、標準のアップロード機能として動作 アップロード開始前にファイルサイズで判定 指定したファイル種別のみを選択画面に表示 キューを使ったアップロードが可能で、アップロード開始前ならキューへの追加・削除が可能 んでもってCakePHPで簡単に利用できる
inputlog - yuga.js 0.5.1 - 優雅なWeb制作のためのJavaScript
バージョンアップはこそこそしていたりする優雅なWeb制作のためのJavaScript yuga.jsの0.5.1を公開します。 CSS HappyLifeの平澤さんにわたして公開していただいた0.4.2からの差分は以下の通りです。 全体の構造変更 グローバル変数yugaをやめ、プラグインの記述方法でjQueryオブジェクト内にyugaを持つように 機能別にfunctionを分け、ソースの最初で初期化をするように 初期化の際、各パラメータを設定できるように interface.roのスクロールが1.2系で動作しないためスクロールを独自実装（interface.jsを廃止） 外部リンクを別ウインドウで開く機能を初期化パラメータで簡単にoffにできるように yuga.js 0.5.1 ダウンロード 不具合などありましたら、この記事にコメントしていただけると助かります。 追記： yuga.js 0
404 Blog Not Found:javascript - tableの横列・縦列をハイライト
2008年03月18日06:30 カテゴリLightweight LanguagesTips javascript - tableの横列・縦列をハイライト これの「横列・縦列をハイライト」をDHTMLで。 Learn Cool Microsoft Excel Conditional Formatting Tricks - Be a Rock star (Tips | How tos - Save time, impress everyone) | Pointy Haired Dilbert - Chandoo.org エクセルのデータを見やすくする5つの簡単なテクニック | コリス まずは邪、じゃなくて横縞。 現金・預金株式以外の証券株式・出資金金融派生商品保険・年金準備金預け金未収・未払金対外証券投資その他合計 1979FY1,948,234242,722452,2410432,1241
「JavaScript でタブ切り替え UI を実装する」を改良してみた - gan2 の Ruby 勉強日記
JavaScript でタブ切り替え UI を実装する | WWW WATCH で紹介されているスクリプトは、 軽いし、ソースも読みやすいしでとても便利。 気になること でも、ちょっと気になることが2つある。 タブが増やしたいときに、スクリプトに自分でセットアップ用のコードを書き足さなくてはならない。 タブをクリックしての切り替えはできるが、アンカータグのリンクからタブを切り替えることができない。 気になることを直すと得られるメリット 1.は大した手間ではないのだけど、 どうせならHTMLを編集するだけで自動的にタブが作られた方が便利。 2.はそんなことできなくてもいいって人の方が多いのかもしれないけど、 僕は以下のように書いたリンクからもタブ切り替えできたほうがうれしい。 <a href="#menu1">Menu1へ飛ぶ</a> デモとソース一式 ってことで、リンク先のスクリプトにちょ
GT Nitro: カーレーシング・ドラッグレーシングゲーム - Google Play のアプリ
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
prototype.js でタブ切り替え - AUSGANG SOFT
たつをさんのCSS と JavaScript でタブ切り替えをprototype.jsを使って書き直しました。 極力、再利用が簡単になるようにしてみました。 ライセンスは本家の「無償・無保証・著作権放棄」に準じます。 ご自由にお使いください。 サンプルはこちらからダウンロードできます。 基本コードは以下のようになっています。 <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript" src="tabMaker.js"></script> <link href="tabMaker.css" rel="stylesheet" type="text/css" /> <div id="tabContent"> <ul id="tabIndex"> <li class="tab
JavaScript サンプル：『年月に合わせて日付の項目数を変更させてみる』
説明 選択フォームで日付を選択してもらえば、入力チェックなどの手間が省けるので良いのですが、月によって日の値は変わってしまうので、存在しない日付が選択できてしまいます。 しかし、日を選択する選択フォームの項目を動的に変更してやれば問題ありません。 コード function setDay(obj){ obj = obj.form; var years = parseInt(obj.years.options[obj.years.selectedIndex].value); var months = parseInt(obj.months.options[obj.months.selectedIndex].value); var lastday = monthday(years,months); var itemnum = obj.days.length; if (lastday - 1
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
まぐまぐ！ - 読みたいメルマガ、きっと見つかる。