twitter facebook hatena google pocket faviconに数字を乗せられると新着記事数や日付など様々なお知らせをお知らせすることができます。 tommoor/tinycon - GitHubはそんなJavaScriptです。 sponsors tommoor/tinycon - GitHubからファイルをダウンロード。 <script type="text/javascript" src="tinycon.js"></script> <script> (function(){ Tinycon.setBubble(2); //()内の数字が表示されます。 Tinycon.setOptions({ //オプション width: 7, //幅 height: 9, //高さ font: '10px arial', //フォント colour: '#ffffff'
コーディングで時間のかかる要素の1つとして、id,class名や画像名などの命名規則が挙げられます。 特に中規模、大規模のサイトで、適当な名前を付けると名前が被る確率が上がり、 その結果、画像の上書きや不要なプロパティがかかってしまうなど、よくない結果になることも考えられます。 一つの例として、私の命名規則について紹介してます。参考程度に読んで頂けると幸いです。 カテゴリに分類して、つなげる。 ページのどの位置に属すか分類し、つなげる方法を取っています。 基本的に、CSSや画像名は同じにします。同名にすることで、名前を考える手間も省け、変更箇所の特定がしやすくなります。 例: CSS #top-side-nav 画像 top-side-nav-home.png top-side-nav-company.png 上記のように命名することで、 デザインを見なくても、どのような箇所に使われている
2012年02月09日 13時58分更新 文●斉藤祐也/<a href="http://css.studiomohawk.com/">CSS Radar</a> 最近のWebサイトは大規模傾向にあり、Webアプリケーションを構築する機会も増えてきました。jQueryやMooToolsなど、JavaScriptを手軽に利用できるようにするライブラリーが普及する一方、Webサイトの表示を担うCSSにも、「Blueprint」や「960 Grid System」に代表されるフレームワークが登場しています。 「LESS」や「Sass」のようなCSS拡張メタ言語は、こうしたフレームワークとは異なり、CSSの言語自体を拡張し、CSSには存在しない機能を追加するものです。CSS拡張メタ言語を利用することで、変数、ミックスイン、入れ子ルール、名前空間、四則演算、関数などの動的な処理をCSSに追加でき、CS
@hokaccha に言われて便利すぎて脳みそ飛び出るかと思った途中から嘘です 以下、見たことのある内容が続きます 全然気がつかなかった・・・いつからだろう・・・ > 17からだそうです Chromeにビルトインされてるのですぐ使えます。 ちなみに、キャプチャはChromeのdev版なのでstable版は少し違うかもしれません。stable(Macの17.0.963.46)でもOverride User Agentの項目あるのは確認してます。 通常はもちろんユーザーエージェントはChromeですが、Cmd+Option+I などでインスペクタを開くと 右下にギアアイコンがあって、そこからインスペクタのSettingが開けます すると Override User Agent という項目があるので チェックすると、よく使いそうな User Agent 一覧がプルダウンで開きます 試しに iPh
Android案件の見積り | クラスメソッド開発ブログ を読んで、業界人らしき人のブコメが、「この程度でホッテントリか」という感じで、僕もややそっちよりの意見だったので、ざっくり補足できそうな点について書いて見ました。もう転職して受託の立場ではなくなったので。やや発注側の視点も含まれています。 責任のないリスクについてコスト負担範囲を決める すべてにおいて最重要項目です。変化の激しいスマホ業界においては、互いのリスクテイクについての認識をあわせておく必要があります。例としてはこんなものがあります。 開発期間中に突如OSのメジャーバージョンアップがあった。 顧客「あ、新しいのでましたね。対応できますよね^^」 世論に応じて機能の根幹部分が突然リジェクト対象になる。 りんご「今日から電話番号認証禁止ね^^直さないと削除しちゃうよ^^」 過去を顧みない方針転換がなされる ぐぐる「メニューボタン
NHN Japan ウェブサービス本部の「キョウ」と申します。 NAVERサービスのマークアップ等を担当している、「突っ込みづらいキャラ」で有名な男ですw 今回はマークアップエンジニアやSEOエンジニアの中で注目を集めている、 schema.orgについてご説明させていただきます。 この記事を読んでいる方の中には「schema.org公式サイト(英)」 「schema.org 日本語訳」をご覧になった方も多いと思いますが・・・ 皆様理解できましたか? 正直難易度が高いと思うので、初心者向けに内容を砕いて説明していきます。 目次 1. schema.orgとは? 2. schema.org導入メリットは? 3. schema.org 初心者向けQ&A 4. schema.org実践編 5. 最後に 1. schema.orgとは? 簡単に説明すると、schema.orgの仕様通りにH
iOSのSafariには「autocapitalize」という属性があり、onにすると、英語で例えば「Hello」などと最初の文字を大文字で打ち込みやすいように、あらかじめShiftキーが押された状態になりました。 iOS 5では、この属性が拡張されて、「on/off」に加えて次のような属性値が設定できるようになりました。 characters ずっとShiftキーが押された状態になり、すべて大文字で記入されます。一時的に解除することはできますが、1文字小文字を打ち込んだらすぐにShiftキーが押された状態に戻ります。 sentences(textareaのみ) 改行するごとに、最初の文字が大文字になります。「on」と同じ値でしょうか? words 空白を入れるごとにShiftキーが押されます。「Hello Again」などの文章が打ち込みやすくなります。 といった具合。どちらにしても、あ
海外で有名なウェブ制作系サイト『Smashing Magazine』がリリースしているebook『Professional Web Design, Volume 2』が、期間限定で無料ダウンロードできるので紹介します。 ダウンロードできる期間は7日間なので、お早めに。 あと、5日かな? Professional Web Design, Volume 2 ※2014/2/4追記 ダウンロード期間は終了したため、リンクは削除しました。 [ad#ad-2] ebookのダウンロード方法 ebookの中身をちょっとだけ紹介 ebookのダウンロード方法 ebookの無料ダウンロードはDolodyのキャンペーンで、まずはサイトにアクセスします。 Dolody Dolodyは『Noupe』と『BundleHunt』のクリエイターが立ち上げた新サイトです。
ページめくりを実現するためのjQueryプラグイン集 先日のHTML5で美麗なページめくり効果が作れるJSライブラリ「turn.js」 では多くの反響を頂きましたが、他にも同様のページめくりライブラリがあるようです Booklet 個人的にコンパクトなインタフェースがいいなと思うライブラリです。 HTML5がなくともIE8でも動きます Create a page flip effect with HTML5 canvas | Tutorial | .net magazine 以前紹介した、HTML5を使ったページめくりUIの作成チュートリアル。独自に作る場合は参考にできます jFlip なめらかなページめくりを表現できるjQueryプラグインです。 カーソルを合わせるとめくり部分が微妙にアニメーションしているあたりも芸が細かいです Simple Page Peel Effect with
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く