タグ

2014年1月15日のブックマーク (4件)

  • [CSS]かっこいいアイデアが盛り込まれた横からスライドするナビゲーション

    スクリプト無しで、コンテンツをスライドさせ、横からアニメーションで表示されるナビゲーションを実装するスタイルシートを紹介します。 このオフキャンバスのスタイルも少しずつ確実に進化してますね。 デモのアニメーション スライドの切替にはチェックボックスを使われており、ナビゲーションが表示される際には各アイテムが異なるタイミングでアニメーションします。 HTML コンテンツエリアはsection要素で、そこにナビゲーション表示のトグルとなるチェックボックスのラベルを配置します。ナビゲーションは、普通にリスト要素で実装します。 <div id="wrapper"> <div class="mobile"> <!-- トグルとなるチェックボックス --> <input type="checkbox" id="tm" /> <!-- ナビゲーション --> <ul class="sidenav"> <

  • スクロールで隠れるナビゲーションメニューhidenavi.jsをjQueryで作りました

    ページをスクロールすると、左側に固定したナビゲーションメニューがアニメーションで隠れ、コンパクトに収納されるJavaScript(以下、js)「hidenavi.js」を作りました。 jsの動作にはjQueryが必要です。 せっかく作ったので、ブログで公開しようと思います:) 1.動作の説明とデモ2.ダウンロード3.使い方4.ご利用にあたって 1.動作の説明とデモ hidenavi.jsは、ページをスクロールすることで、ページの左側に固定したナビゲーションメニューが、にゅーっとアニメーションし、隠れます。 隠れたナビゲーションメニューの代わりに、ナビゲーションメニューの位置を示す要素が表示されます。 その要素にマウスを乗せると、隠れたナビゲーションメニューが再びアニメーションで表示されます。また、スクロール位置を一番上まで戻しても、ナビゲーションは再表示されます。 デモページを作りましたの

    スクロールで隠れるナビゲーションメニューhidenavi.jsをjQueryで作りました
  • Evernoteのノートの目次を作れるアプリ「Note Linker」

    アプリ名:Note Linker 金額:無料(1月14日時点) カテゴリ:仕事効率化 開発:Takaiwa29 使用端末:Nexus 5 おすすめ度:★★★★☆ 「Note Linker」は、Evernoteのノートの目次を作成できるアプリだ。よく呼び出すノートをまとめて目次を作成しておくことで、毎回キーワードを入れて検索したり、ノートブックやタグから探さなくとも、目的のノートをすばやく呼び出せるようになる。 アプリを起動すると、「作る」「見る」という2つのタブが表示される。「作る」を選択し、「キーワード」「ノートブック」「タグ」のメニューを使用して、目次に含めたいノートをリストアップする。例えば“見積書”というキーワードを含むノートを束ねた目次を作りたいのであれば、「キーワード」を選んで「見積書」を含むノートを検索し、リストアップされた中から必要なノートを選ぶ。 その後ウィザードに従って

    Evernoteのノートの目次を作れるアプリ「Note Linker」
  • Photoshop Vip » 味わいのあるPhotoshop用グランジストライプパターン6枚セット「Grungy Stripes Pattern」

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    Photoshop Vip » 味わいのあるPhotoshop用グランジストライプパターン6枚セット「Grungy Stripes Pattern」